Ubuntu环境下Laravel如何实现热更新

在 Ubuntu 环境下，Laravel 实现热更新可以通过 Laravel Mix 的 BrowserSync 插件来完成。BrowserSync 可以实时同步浏览器操作，例如代码更改后自动刷新浏览器。以下是实现热更新的步骤：

1. 安装 Node.js 和 NPM

   在终端中运行以下命令来安装 Node.js 和 NPM：

   curl -sL https://deb.nodesource.com/setup_14.x | sudo -E bash -
   sudo apt-get install -y nodejs
   

2. 安装 Laravel Mix 和 BrowserSync

   在 Laravel 项目根目录下，运行以下命令来安装 Laravel Mix 和 BrowserSync：

   npm install laravel-mix browser-sync browser-sync-webpack-plugin --save-dev
   

3. 配置 Laravel Mix

   打开项目根目录下的 webpack.mix.js 文件，添加以下代码来配置 BrowserSync：

   const mix = require('laravel-mix');
   const BrowserSyncPlugin = require('browser-sync-webpack-plugin');
   
   /*
    |--------------------------------------------------------------------------
    | Mix Asset Management
    |--------------------------------------------------------------------------
    |
    | Mix provides a clean, fluent API for defining some Webpack build steps
    | for your Laravel applications. By default, we are compiling the CSS
    | file for the application as well as bundling up all the JS files.
    |
    */
   
   mix.js('resources/js/app.js', 'public/js')
      .postCss('resources/css/app.css', 'public/css', [
          //
      ]);
   
   mix.webpackConfig({
       plugins: [
           new BrowserSyncPlugin({
               host: 'localhost',
               port: 3000,
               proxy: 'your-app-domain.test' // 替换为你的应用域名
           })
       ]
   });
   

   请确保将 your-app-domain.test 替换为你的应用域名。

4. 运行热更新

   在终端中运行以下命令来启动热更新：

   npm run hot
   

   现在，当你修改项目中的任何文件时，浏览器将自动刷新以显示更改。

注意：在生产环境中，不建议使用热更新。在生产环境中，你应该使用 npm run prod 命令来构建你的应用程序，以获得最佳性能。