实时刷新
实时刷新
虽然 Laravel Mix 提供开箱即用的 Browsersync
刷新功能,但您可能更喜欢使用 LiveReload 。 LiveReload 可以自动监视您的文件以进行更改,并在检测到修改时刷新页面。
1. 安装 webpack-livereload-plugin
npm install webpack-livereload-plugin@1 --save-dev
2. 配置 webpack.mix.js
将下面的代码添加到 webpack.mix.js 的底部:
var LiveReloadPlugin = require('webpack-livereload-plugin');
mix.webpackConfig({
plugins: [new LiveReloadPlugin()]
});
虽然上面的 LiveReload 配置很好地配置和使用默认值,但此插件还有更多可用的选项,可用点击这里查看 here.
3. 安装 LiveReload.js
当然, 我们需要安装 LiveReload.js。 你可以通过 LiveReload Chrome plugin 来安装, 或者在 </body>
标签之前添加以下代码:
@if(config('app.env') == 'local')
<script src="http://localhost:35729/livereload.js"></script>
@endif
4. 运行开发模式服务器
npm run watch
现在,LiveReload 将会自动监控您的文件是否被修改并刷新页面。 愉快!
本译文仅用于学习和交流目的,转载请务必注明文章译者、出处、和本文链接
我们的翻译工作遵照 CC 协议,如果我们的工作有侵犯到您的权益,请及时联系我们。
推荐文章: