search

sveltejs / template-webpack

Template for building basic Svelte applications with webpack
300 stars 118 forks source link

Hot reload, how to watch for global.css too #31

Closed Alexn117 closed 3 years ago

Alexn117 commented 3 years ago

I'm new to webpack. I opted to use this template, instead of the default one with Rollup, because webpack comes with a proxy feature that I need for development and Rollup currently does not.

The problem is that the global.css inside the public folder does not trigger hot reload when changes are made. Making changes to the styles in .svelte files does work as expected. I tested making changes to the same global.css in the default template with Rollup and that triggers hot reload just fine. Anyone know which settings I'm supposed to add to webpack.config.js to get this to work?

non25 commented 3 years ago

You need to set hot: true in the devServer section, and import global.css in main.js to have hot module replacement of css. Import it like this:

import './global.css';