Laravel Mix BrowserSyn c Не срабатывает

Question

Согласно Laravel Смешать документы . Я использую Webpack для компиляции стилей и запуска BrowserSyn c в процессе.

Это мой полный документ webpack.mix. js. Вы можете увидеть browserSyn c в строке 92:

require('laravel-mix-merge-manifest');
const fs = require('fs');
const mix = require('laravel-mix');
const pathEnv = 'resources/sass/_enviroments/' + process.env.NODE_ENV;
const sites = [
   'RP-ES',
   'TZ-ES',
   'CAL-ES',
   'RUP-ES',
   'FL-ES',
   'SP-ES',
   'WPX-IT',
   'WPX-UK',
   'WPX-CH',
   'WPX-FR',
   'WPX-DE',
   'WPX-PT',
   'WPX-NL',
   'MTN-ES',
   'MTN-DE',
   'MTN-FR'
];

const tmpFiles = [];

try
{
   if (process.env.NODE_ENV == 'development')
   {
      if (!process.env.hasOwnProperty('npm_config_only_css'))      
         generateJS();      

      if (!process.env.hasOwnProperty('npm_config_only_js'))
      {   
         if (!process.env.hasOwnProperty('npm_config_site'))
         {
            //   throw('In development, parameter "--site" is mandatory, one of the follow values: "'+sites.join('", "')+'"');
            sites.forEach(slug=>{
               generateSiteCss(slug)
            });
         }
         else      
            generateSiteCss(process.env.npm_config_site);      
      }

      var BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
      mix.webpackConfig({plugins: [new BundleAnalyzerPlugin()]});
   }
   else
   {
      generateJS();
      sites.forEach(slug=>{
         generateSiteCss(slug)
      });
   }

   mix.version()
   mix.mergeManifest()
   mix.then(deleteTmpFiles);
}
catch(e)
{
   deleteTmpFiles();
   throw e;
}

function generateJS()
{
   console.log('Generating JS...');

   // app scripts (common in all pages)
   mix.js('resources/js/app.js', 'public/js')      
      .extract()

      // individual scripts (auto register) to use alone en certain pages
      .js('resources/js/components/helpcenter_results.vue.js', 'public/js/vue_components')  // used in helpcenter    
      .js('resources/js/components/newsletter.vue.js', 'public/js/vue_components') // used in home
      .js('resources/js/components/slick_carousel.vue.js', 'public/js/vue_components') // used in product pages & designs list
      .js('resources/js/components/vue_tab.vue.js', 'public/js/vue_components')  // used in login      

      // combined components with auto register included
      .js('resources/js/products_page.js', 'public/js')
      .js('resources/js/checkout.js', 'public/js')
      .js('resources/js/payment_methods.js', 'public/js')
      .js('resources/js/cart.js', 'public/js')
      .js('resources/js/products_list.js', 'public/js')
      .js('resources/js/accounts.js', 'public/js')            
      // required libs that are used in certain pages and are not available througth npm
      .copyDirectory('resources/js/libs','public/js/libs')      
      .copyDirectory('resources/fonts','public/fonts')      
      .copyDirectory('resources/css','public/css')      
      .browserSync('regalospersonales.local');
}

function generateSiteCss(slug)
{
   console.log('Generating CSS for the site: '+ slug +'...');

   let pathSite = `resources/sass/_sites/${slug}`;
   let outputPath = `public/css/sites/${slug}`;
   let tmpPath    = `resources/sass/${slug}`;   

   let includePaths = [
      pathEnv,
      pathSite
   ];     


   fs.writeFileSync(`${tmpPath}_common.scss`, `@import '_common';`);
   fs.writeFileSync(`${tmpPath}_helpcenter.scss`, `@import '_helpcenter';`);

   tmpFiles.push(`${tmpPath}_common.scss`);
   tmpFiles.push(`${tmpPath}_helpcenter.scss`);

   mix.sass(`${tmpPath}_common.scss`,     `${outputPath}/common.css`, { includePaths: includePaths })
      .sass(`${tmpPath}_helpcenter.scss`, `${outputPath}/helpcenter.css`, { includePaths: includePaths })
      //.then(deleteTmpFiles)
   //console.log(result);
   //throw new Exception('asdfasdf');
}

function deleteTmpFiles(){
   console.log('Deleting temporal files...');

   tmpFiles.forEach(f=>{
      if (fs.existsSync(f))
         fs.unlinkSync(f);
   });
}

И, конечно же, с моим пакетом установлен браузер syn c. json:

  "devDependencies": {
    "browser-sync": "^2.26.7",
    "browser-sync-webpack-plugin": "^2.0.1",

Все выглядит хорошо. Но когда я выполняю:

npm run watch

Все мои стили и javascript скомпилированы, часы активируются, но ничего не говорят о BrowserSyn c. Никаких ошибок и ничего не происходит, вроде игнорируется BrowserSyn c. В чем дело?