HMR not reloading SCSS

I have Laravel Mix setup on a project and it’s working as expected. When running in hmr mode I can see in the console that it’s recompiling each time I change a SCSS or JS file.

However, it’s only reloading the javascript changes. If it’s a SCSS file that’s changed although HMR is triggered on the page, it says no changes have been detected.

[WDS] App hot update...
app.js:4282 [HMR] Checking for updates on the server...
app.js:9069 [HMR] Nothing hot updated.
app.js:4264 [HMR] App is up to date.

If I reload the web page then I see my SCSS changes.

Is this broken, or expected behaviour? I’d love to see my SCSS changes as well.

[JeffreyWay]

It won’t work right now for regular Sass files. The HMR feature is specifically for Vue and .vue components.

[amcsi]

What I was able to do to get hot reloading of app.scss to work (with VueJS) was to do this in my root .vue component:

<style lang="scss">
    @import 'resources/assets/sass/app.scss';
</style>

Notice lang="scss" and no scoped.