Laravel 5.4 使用 browserSync 观看刀片文件答案

【问题标题】：Laravel 5.4 watch blade files with browserSyncLaravel 5.4 使用 browserSync 观看刀片文件
【发布时间】：2017-09-29 22:14:31
【问题描述】：

在 laravel 5.4 mix 和 browserSync 是默认的。如果我从resources/views 修改任何*.blade.php 文件，我想用新的更改刷新我的浏览器。在我的webpack.mix.js我有这个配置：

const { mix } = require('laravel-mix');

mix
    .js('resources/assets/js/app.js', 'public/js')
    .sass('resources/assets/sass/app.scss', 'public/css')
    .browserSync({
        proxy:'localhost',
        port:8000,
        files: {
            match: [
                "resources/views/**/*.blade.php",
                "public/css/*.css",
                "public/js/*.js",
            ],
            fn: function (event, file) {
                /** Custom event handler **/
            },
            options: {
                ignored: [
                    '*.txt',
                    '*.json'
                ]
            }
        },
        logPrefix:'L54',
    });

我不知道我是否做得对，或者我可能必须设置混合配置左右。任何帮助将不胜感激。

【问题讨论】：

标签： laravel-5.4 browser-sync laravel-mix

【解决方案1】：

对于仍然想知道的人来说，这似乎适用于 Laravel 5.5（开发分支）：

mix.browserSync({
    proxy: 'https://www.site.example',
    files: [
        './resources/views/**/*.blade.php',
    ]
})

【讨论】：

正是我正在寻找的，因为观看所有文件，对我来说似乎工作得慢一点，。

【解决方案2】：

但是/public 中的资产重新加载好吗？

无论如何，我认为您不需要指定要观看的文件，因为这些是默认设置。我的配置只是

mix.browserSync({
  proxy: 'theapp.dev'
});

但是，如果您确实需要更改该部分配置（用于自定义回调），files 选项应该是一个数组（同时接受字符串和对象）：

browserSync({
  files: [                           // 'files' array
    "wp-content/themes/**/*.css",      // 1st element
    {                                  // 2nd element
      match: ["wp-content/themes/**/*.php"],
      fn:    function (event, file) {
            /** Custom event handler **/
      }
    }                                  // end 2nd element
  ]                                  // end 'files' array
});

【讨论】：

【解决方案3】：

我发现观看我在 Laravel 中所做的一切的最佳设置：

mix.browserSync({
    proxy: 'https://www.site.example',
    files: [
        './app/**/*',
        './routes/**/*',
        './public/css/*.css',
        './public/js/*.js',
        './resources/views/**/*.blade.php',
        './resources/lang/**/*',
    ]
})

【讨论】：