Browser-sync doesn't reload pages-CodePudding

With the below package.json file, my CSS and js compile OK and open a browser window proxying the correct site. But saving changes in files isn't causing the browser to refresh.

{
  "scripts": {
    "watch:css-app": "tailwindcss -i ./src/css/app.css -o ./public_html/assets/css/app.css --postcss --watch",
    "watch:js": "./node_modules/.bin/esbuild ./src/js/app.js --bundle --outfile=./public_html/assets/js/app.js --watch",
    "watch": "cross-env NODE_ENV=development concurrently 'npm run watch:css-app' 'npm run watch:js'",
    "browser-sync": "cross-env NODE_ENV=development browser-sync start --proxy='https://site.local/' --files='./*'",
    "watch-sync": "concurrently 'npm run browser-sync' 'npm run watch'"
  },
  "devDependencies": {
    "autoprefixer": "^10.4.13",
    "browser-sync": "^2.23.0",
    "concurrently": "^6.2.1",
    "cross-env": "^6.0.3",
    "postcss": "^8.4.20",
    "postcss-import": "^15.1.0",
    "resolve-url-loader": "^3.1.2",
    "tailwindcss": "^3.2.4"
  }
}

I've tried a few different things in the --files option:

--files='./path_to_html/**/*.html,./path_to_css/**/*.css'
--files=['./path_to_html/**/*.html','./path_to_css/**/*.css']
omit --files and have --watch instead

But none of those work. Just to be clear, I'm not using Webpack, Gulp etc., I'm just calling npm run watch-sync and package.json is doing the rest.

Anyone know what I'm missing from my config to get this working?

Edit: I've changed things up a bit, but still getting the same result.

Now I've changed my browser-sync script to "browser-sync": "cross-env NODE_ENV=development node bs.js" and bs.js looks like:

const bs = require('browser-sync').create();

bs.emitter.on('init', function () {
    console.log('Browsersync is running!');
});

bs.watch('*.html').on('change', bs.reload);

bs.watch('*.css', function (event, file) {
    if (event === 'change') {
        bs.reload('*.css');
    }
});

bs.init({
    proxy: 'https://td.local/'
});

As before, when running the script, a new window is launched that loads the site, but changes to files don't cause a reload and also, I'm not getting the message in the console even though the init is telling the script which URL to proxy and it's doing that part. :?

CodePudding user response：

I found the anwser:

bs.init({
    injectChanges: false,
    files: ['./**/*'],
    proxy: 'localhost'
});