verekia/js-stack-from-scratch

Feature: Possible example of HMR of .css files?

renshenhe opened this issue · 3 comments

I am having a little trouble setting up hot reloading when styles are changed for .scss files in development for a SSR app.

I am currently using node-sass to watch for changes of a main.scss file and generating a .css in a public folder where is rendered from the server to load the styles.

The issue with my current approach is it requires manual refresh for style changes and for me to add @import of every component's style in main.scss so node-sass does not create a .css variant of component's .scss file in the component's directory.

I am hoping to setup webpack where I can import ./style.scss in the component and should the component be used extract-text-webpack-plugin would be able to handle the conversion and add it to a single .css file. I would also hope to have it all hot-reloadable should it be possible but finding a solution have seems to elude my searches. I am fine with manually refreshing styles but hope for a better setup than my current.

This issue can be solved by using isomorphic-webpack

Sent from my LGE Nexus 5X using FastHub

I have never been savvy with webpack to be able to navigate integrating isomorphic-webpack in my current setup. The documentation is a little sparse at the moment in covering use cases.

Cool, I'm working on the same.