如何部署Laravel与Angular全栈电商项目并完成压缩上线

一、项目压缩&构建预处理 #

1. 前端Angular项目打包压缩 #

• 进入本地Angular项目根目录，执行依赖安装确保构建环境正常：npm install
• 运行生产环境构建命令，Angular会自动完成代码压缩、摇树优化、死代码剔除、资源混淆：ng build --configuration production
• 构建完成后根目录会生成dist/文件夹，所有可上线的静态资源都在该目录下，无需额外压缩操作。

2. 后端Laravel项目瘦身优化 #

• 进入本地Laravel项目根目录，执行以下操作减少项目体积、提升运行效率：
  • 安装生产环境依赖，排除开发依赖并优化自动加载：composer install --optimize-autoloader --no-dev
  • 生成配置、路由、视图缓存，减少运行时解析开销：

    php artisan config:cache
    php artisan route:cache
    php artisan view:cache
    

  • 手动删除不需要上线的文件：.git文件夹、tests目录、.env.example、.gitignore、phpunit.xml等开发相关文件。
• 如需将整个后端打包上传，可执行压缩命令自动排除冗余文件：zip -r laravel-api.zip ./* -x "*.git*" -x "tests/*" -x "*.env.example"

二、项目合并部署操作 #

1. 项目合并规则 #

• 将Angular构建生成的dist/目录下的所有文件，全部移动到Laravel项目的public/目录中。
• 为了兼容Angular的前端路由，避免刷新页面404，需要在Laravel中添加路由兜底规则，打开routes/web.php在末尾添加如下代码：

  Route::get('/{any}', function () {
      return file_get_contents(public_path('index.html'));
  })->where('any', '^(?!api).*$');
  

  上述规则会将所有非/api前缀的请求都返回Angular的入口文件，不影响后端API的正常调用。

2. 上传到托管主机部署 #

• 提前确认托管主机的环境满足要求：PHP版本匹配你使用的Laravel版本，已安装BCMath、Ctype、Fileinfo、JSON、Mbstring、OpenSSL、PDO、Tokenizer、XML等Laravel required扩展。
• 如果你使用的是虚拟主机：
  • 通常虚拟主机默认站点根目录为public_html或www，建议将合并后的Laravel项目中public目录下的所有文件上传到public_html，其余Laravel核心文件上传到虚拟主机的非公开根目录（和public_html同级），避免核心代码暴露。
  • 上传完成后修改public_html/index.php中的加载路径，将__DIR__.'/../vendor/autoload.php'和__DIR__.'/../bootstrap/app.php'的路径修改为你实际存放Laravel核心文件的路径。
• 如果你使用的是VPS/云服务器：
  • 将合并后的整个Laravel项目上传到服务器指定目录，配置Nginx/Apache的站点根目录指向项目的public文件夹。
  • 添加Nginx伪静态规则，确保路由正常解析：

    location / {
        try_files $uri $uri/ /index.php?$query_string;
    }
    

• 部署完成后修改项目根目录下的.env配置文件：设置APP_ENV=production、APP_DEBUG=false、APP_URL为你的站点域名，填写正确的数据库连接信息。
• 最后验证：访问站点域名确认前端页面加载正常，调用/api前缀的接口确认后端服务响应正常。

内容的提问来源于stack exchange，提问作者Osama Amr