Changing `scss`/`css` file breaks style on livereload
See original GitHub issueChoose one: is this a 🐛 bug report or 🙋 feature request? 🐛 bug report
🎛 Configuration (.babelrc, package.json, cli command)
The project I’m working is available here, you can checkout and reproduce the issue on it.
.babelrc:
{
"presets": ["env", "preact"],
"plugins": [
"transform-function-bind",
["transform-react-jsx", { "pragma": "h" }],
["module-resolver", {
"root": ["."],
"alias": {
"@app": "./src"
}
}],
"transform-object-rest-spread"
]
}
.postcssrc:
{
"modules": true,
"plugins": {
"autoprefixer": {
"grid": true
}
}
}
🤔 Expected Behavior
Changing a scss
file with css modules enabled that is “named-imported” (import s from './style.scss'
) in js and used in className
by preact
/react
/etc should update the js that requires it providing the new className
variable to it, without needing a manual full page reload.
😯 Current Behavior
Changing the scss
updates the stylesheet causing the network fetch for the new asset but not for the js file, so all styles changed breaks on the page since the old classes doesn’t exist anymore, to see the changes a manual full page reload is needed.
💁 Possible Solution
I really don’t have a clue about this… Sorry…
🔦 Context
For example going into src/home/home.scss
and changing .Title
color will reproduce the bug (as of commit 451f3a2)
💻 Code Sample
You can see the open sourced project here (https://github.com/wescoder/tavern)
🌍 Your Environment
Software | Version(s) |
---|---|
Parcel | ^1.4.1 |
Node | v9.2.0 |
npm/Yarn | 1.3.2 |
Operating System | Linux Deepin 15.5 (Ubuntu based) |
Issue Analytics
- State:
- Created 6 years ago
- Reactions:11
- Comments:7 (1 by maintainers)
Same problem for me when using CSS modules with HMR. This is the only thing that keeps me from using parcel for new projects.
I was able to get fix this by setting this on .postcssrc
from https://github.com/parcel-bundler/parcel/issues/809#issuecomment-385250361