Are you sure your application is running on localhost:8000? Also you need to specify which files or directories to watch

Source: https://www.npmjs.com/package/laravel-elixir-browser-sync

Yeah I am sure. This is last feature of Elixir. this should be enough setting.

Look at this lesson from yesterday: https://laracasts.com/series/painless-builds-with-laravel-elixir/episodes/13

I have setup browserSync on one of my projects to test it out and I have no problems on my mac. It might be a Windows issue. I'm not a Windows expert so..

@blaztar is not using Homestead. I'm having the same issue (and I'm on a mac).

mix.sass('app.scss')
        .browserify(['app.js'])
        .browserSync({proxy: 'localhost:8000'});

$ php artisan serve
$ gulp watch (in another tab)

[BS] [info] Proxying: http://localhost:8000
[BS] Access URLs:
 -------------------------------------
       Local: http://localhost:3000
    External: http://192.168.1.41:3000
 -------------------------------------
          UI: http://localhost:3001
 UI External: http://192.168.1.41:3001
 -------------------------------------

localhost:3000 won't load. localhost:8000 won't sync (of course) ... but loads

Ok... got it to work

$ php artisan serve --host=0

And use

mix.browserSync({proxy: 'localhost:8000'});

I just tried this out for the first time. For me using proxy: 'localhost:8000' is enough. No need to set the host with artisan serve.

I'm running Mamp & a custom local domain name. I managed to set it up once, and it works with my own domain, though i have to access it via mydomain.com:3000.

The thing is on my 2nd project, i assigned a new domain name, other.domain.com, browserSync doesn't seem to be working even though I set it up the same. If i try other.domain.com:3001, i see the browserSync admin panel, just that no matter what browsers i use, I don't see any current connections. I still see the usual site at other.domain.com:3000, just that it isn't sync'ing

:(

Managed to fix my issue, it was caused by another error [https://laracasts.com/discuss/channels/laravel/page-is-not-empty]. I had an offending "-" text before one of my <?php

I'm not using Homestead, so it autoreloads when I change something in the view put not in the scss, pretty weird.

elixir(function(mix) {
  mix.sass('app.scss', 'public/assets/css')
  mix.browserSync({proxy: 'localhost:8000'});
}); 

Not even a readme file found here https://www.npmjs.com/package/laravel-elixir-browser-sync

@Bloomanity Would you mind explaining why --host=0 does the job here?

It starts the server on ip 0 which is either interpreted as any ip address or an invalid address (depends on your setup)... but it's any address more times than not.

It means that localhost and 127.0.0.1 or you private ip address will respond on the port you've chosen.

Some apps or processes won't treat as being the same: localhost, 127.0.0.1 or you're private ip address.

Well, i pasted this in my blade layout:

­` <script id="__bs_script__">//<![CDATA[ document.write("<script async src='http://HOST:3000/browser-sync/browser-sync-client.2.13.0.js'><\/script>".replace("HOST", location.hostname)); //]]></script>

and in my gulpfile:

.browserSync({ proxy: false, logConnections: true, reloadOnRestart: true, notify: true }); the proxy set to false is the important, when you run gulp watch you will see the same script from above.

i always got : "Unknown: php_network_getaddresses: getaddrinfo failed" when i tryed "$ php artisan serve --host=0".

If you have the same problem try: "php artisan serve --host=127.0.0.1" on one tab and gulp watch on another. Worked for me immediately. Besides set your proxy with "mix.browserSync({proxy: 'localhost:8000'});" like the others mentioned.

Thanks @Edgar.Hauf ! I'm running on windows 7, and just spent 1 to 2 hours working around this problem, you saved me, thanks.

Thanks #Edgar.Hauf

Laravel 5.4 with laravel-mix & Browsersync setup

Install

composer create-project gurinder/lmb AppName --prefer-dist
npm install
npm run watch

Visit gurinder/lmb github page for more details

I'm wondering if there's a decent guide/article anywhere for setting up webpack livereload workflow w/ blade too! (With gulp it's as simple as gulpfile snippit I pre-made) but now we have config.mix and whatnot not very beginner friendly in my opinion I just want to add complete project wide livereloading with 1 simple step like before lol.. seems like this mix update went BACKWARDS in terms of elegance and simplicity (Laravels philisophy?)..

I got it working using .browserSync({proxy: 'example.local'}).

The part I was missing was that you need to access it like this example.local:3000/some/uri