I also faced a similar problem when I was new to browser-sync usage, the command-line was saying “reloading browsers” but the browser was not refreshed at all, the problem was I had not included body tag in my HTML page where the browser-sync can inject script for its functionality, make sure your HTML page has … Read more
Here’s how I got it working. I added port forwarding to vagrant and then I launch browser-sync from within the vm. Everything works now at http://example.dev:3000 and http://example.dev:3001. Here’s what I added to my Vagrantfile: config.vm.network :forwarded_port, guest: 3000, host: 3000, auto_correct: true config.vm.network :forwarded_port, guest: 3001, host: 3001, auto_correct: true
Using BrowserSync as a server only works if you’re running a static site, so PHP won’t work here. Looks like you’re using XAMPP to serve your site, you can use BrowserSync to proxy your localhost. Example: browser-sync start –proxy localhost/yoursite References: http://www.browsersync.io/docs/command-line/#proxy-example https://github.com/BrowserSync/browser-sync/issues/5
The solution is quite simple – but illogical imho. I had my local instance running under http://project.local. Changing it to http://project.dev solved the issue. I’m running OS X.
Install the following dependencies: npm install npm-run-all webpack nodemon Configure your package.json file to something as seen below: package.json { … “scripts”: { “start” : “npm-run-all –parallel watch:server watch:build”, “watch:build” : “webpack –watch”, “watch:server” : “nodemon \”./dist/index.js\” –watch \”./dist\”” }, … } After doing so, you can easily run your project by using npm start. … Read more
For me, it worked by specifying host and then open: ‘external’, like this: browserSync.init({ proxy: ‘http://myproject.dev/’, host: ‘myproject.dev’, open: ‘external’ });
Save as dependencies: npm i package1 package2 Save as dev-dependencies: npm i -D package1 package2 npm i –save-dev package1 package2
Most of the time you can just npm update (or pnpm update or yarn upgrade) a module to get the latest non breaking changes (respecting the semver specified in your package.json) (<– read that last part again). npm update browser-sync ——- pnpm update browser-sync ——- yarn upgrade browser-sync Use [p]npm|yarn outdated to see which modules … Read more
For Node.js applications, check your configuration: app.use(express.static(__dirname + ‘/public’)); Notice that /public does not have a forward slash at the end, so you will need to include it in your href option of your HTML: href=”https://stackoverflow.com/css/style.css”> If you did include a forward slash (/public/) then you can just do href=”https://stackoverflow.com/questions/48248832/css/style.css”.