Browser sync is not reloading browser when I make changes on PHP blade files.

• Laravel Mix Version: 1.5.1
• Node Version (node -v): v8.7.0
• NPM Version (npm -v): 5.4.2
• OS: Ubuntu 16.04.3 LTS (GNU/Linux 4.4.0-81-generic x86_64) (HOMESTEAD)

Description:

I can not make ‘browserSync’ work properly on a fresh install of laravel 5.5 The browser is not refresh when I make a change in blade PHP files. But It is working well with the .sass and .js files.

This is my webpack.mix.js:

mix.js('resources/assets/js/app.js', 'public/js')
    .sass('resources/assets/sass/app.scss', 'public/css')
    .browserSync({
        proxy: 'dearpeninsula.app'
    });

I try to put the option files, and with this option, browsersync is not working on changes files of any type:

mix.js('resources/assets/js/app.js', 'public/js')
    .sass('resources/assets/sass/app.scss', 'public/css')
    .browserSync({
        proxy: 'dearpeninsula.app',
        files: ['resources/views/**/*.*', 'resources/assets/**/*.*']
    });

I have to say, that I have a head and a body tag in the blade file, I work with the standard welcome.blade.php file that laravel provide in the installation.

Steps To Reproduce:

I install a fresh Laravel 5.5 with the command laravel new, in a fresh directory. I aplicate ‘php artisan key:generate’ command to generate laravel’s key. I install npm with command npm install.

I add to the file webpack.mix.js browserSync.

mix.js('resources/assets/js/app.js', 'public/js')
    .sass('resources/assets/sass/app.scss', 'public/css')
    .browserSync({
        proxy: 'dearpeninsula.app'
    });

I execute ‘npm run dev’ I execute ‘npm run watch-poll’ because ‘npm run watch’ is not working and not compile any changes in files.

And that is all.

Many thanks for your help, yesterday I expend many hours to try to fix it without results.

[anixide]

gulp.task('browser-sync', function() {
    browserSync.init({
      watch: true,    // <-- try adding this line when you have a live-reload problem
      server: {
          baseDir: './'
      },
      port: 8080
  });
});

[marcamos]

I have a similar configuration; the difference in mine (below) is that I’ve kept the php file-extension in place:

mix
  .autoload({
    jquery: ['$', 'window.jQuery', 'jQuery'],
    'ally.js/ally.js': ['ally']
  })
  .js('_js/app.js', 'public/lib/js')
  .sass('_scss/app.scss', 'public/lib/css')
  .options({
    processCssUrls: false
  })
  .sourceMaps()
  .browserSync({
    proxy: 'starter.dev',
    files: [
      'public/lib/css/app.css',  // Generated .css file
      'public/lib/js/app.js',    // Generated .js file
      // =====================================================================
      // You probably need only one of the below lines, depending
      // on which platform this project is being built upon.
      // =====================================================================
      'public/**/*.+(html|php)',          // Generic .html and/or .php files [no specific platform]
      'laravel/resources/views/**/*.php', // Laravel-specific view files
      'craft/templates/**/*.+(html|twig)' // Craft-specific templates, as html and/or twig
    ]
  });