Doesn't refresh/inject css files

[stratboy]

Hi, this is my current configuration:

  "scripts": {
    "dev": "run-p dev:*",
    "build": "run-p build:*",
    "build:webpack": "webpack --mode production",
    "dev:webpack": "webpack --mode development",
    "dev:bs": "browser-sync start --proxy '[my dev domain here]' --files 'style.css, **/*.css, ./template-parts/blocks/**/*.scss, ./*.php, ./**/*.php, ../../lib/**/*.php, ./js/dist/*.js, ./js/product-list/dist/*.js'"
  },

Using "browser-sync": "^3.0.2" and "npm-run-all": "^4.1.5"

My problem is that it works for js and php, but not for css. It always worked, it's a configuration I just copy from project to project, which essentially are always the same wordpress module made 100% custom by me.

Browser Sync properly recognize css changes:

[Browsersync] File event [change] : style.css

But under http://localhost:3000/ doesn't refresh. The issue is only for css files. Paths are correct.

Any idea?

[ajiho]

you need to monitor the changes in your CSS and JS yourself, and then call bs.reload() You can use gulp or chokidar to monitor file changes