Laravel Mix + BrowserSync 开箱即用无限加载

Question

我的 Laravel 项目开箱即用 browser-sync 和 browser-sync-webpack-plugin 安装在浏览器同步页面上无限加载。它在 http://localhost 上工作正常，但浏览器同步 (localhost:3000) 版本不会停止加载并且不显示任何内容，只是一个白页。

我发现 this 个问题与我的相似，但没有任何答案。

我的机器上最近才开始出现这种情况。起初我以为是因为杀毒软件或防火墙，但禁用它们没有任何好处。我什至不知道是什么导致页面永远无法加载。

这是我的 webpack.mix.js 文件的样子：

mix.js('resources/assets/js/script.js', 'public/js')
.sass('resources/assets/sass/main.scss', 'public/css')
.disableNotifications()
.browserSync();

编辑：任何有关缩小问题范围的提示也将不胜感激。

Answer 1

对我来说，问题是将 windows 主机文件添加到 url browsersync 代理的内容，并将其指向 127.0.0.1。

Answer 2

Laravel 中使用的 mix-browsersync 包的默认代理目标是 app.test。

您可以在混合文件中指定不同的代理目标：

mix
    .sass('resources/sass/app.scss', 'public/css')
    .js('resources/js/app.js', 'public/js')
    .browserSync('localhost');

而且，如果像我一样，您正在使用 artisan 服务器进行开发，您甚至可以以此为目标（只要您在项目中运行 php artisan serve）：

mix
    .sass('resources/sass/app.scss', 'public/css')
    .js('resources/js/app.js', 'public/js')
    .browserSync('localhost:8000');

Answer 3

我有一个适合你的可行解决方案。

我的问题是我一直专注于使用 localhost:8000；相反，我尝试了 127.0.0.1:8000。对于那些不知道的人，该 IP 地址是您的默认本地主机 IP 地址。

尝试像这样将其添加到您的 webpack.mix.js 文件 \/\/\/

mix.browserSync({
    proxy: 'http://127.0.0.1:8000'
});

或者您可以使用

mix.browserSync('127.0.0.1:8000');

完成后你可以运行 npm run watch.

Laravel Mix + BrowserSync 开箱即用无限加载

Laravel Mix + BrowserSync infinite loading out of the box

laravel

webpack

browser-sync

laravel-mix