Why vue-cli can't refresh the browser automatically when writing css

1. When you modify css, you cannot automatically refresh it by switching to the browser. You need to refresh it manually. Has anyone ever encountered such a situation?
it"s okay to modify others, but css will have this problem.
I use vue-cli 3.0

.

attach the resolved configuration:

// vue.config.js
module.exports = {
    lintOnSave:false,
    devServer:{
        host:"0.0.0.0"
    }
}
Oct.14,2021

I also encountered this problem, but found out that my vue.config.js configured extract:true, to extract style into a separate css file instead of dynamically injecting it into javascipt. Just get rid of this parameter. The following is the original text of the official document:
css.extract
Type: boolean | Object

Default: production environment is false under true, development environment

whether to extract the CSS from the component into a separate CSS file (rather than the inline code that is dynamically injected into JavaScript).

also when building Web Components components, it is always disabled (the style is inline and injected into shadowRoot).

When

is built as a library, you can also set it to false to prevent users from importing CSS themselves.

extraction CSS is not enabled by default in development environment mode because it is not compatible with CSS hot overloads. However, you can still explicitly set this value to true to force extraction in all cases.


webpack has hot loading function. Check whether your webpack is configured with


are you using webstorm


is the style in the .vue file? shouldn't this be


how do you solve it?


landlord, post the solution? Add webpack hot load configuration to vue.config.js?

Menu