如何在同一个Heroku应用中同时部署Laravel与Flutter Web项目

你之前强制推送失败的核心原因是直接用Flutter项目的Git仓库覆盖了原有Laravel应用的代码，Heroku单应用默认只会识别单一项目类型的构建规则，直接覆盖会导致原有Laravel运行环境被冲毁。
下面是两种可落地的部署方案：

方案一：本地预编译Flutter Web（推荐，部署复杂度最低） #

不需要调整Heroku原有配置，只需整合两个项目的代码：

• 本地进入Flutter项目根目录，执行flutter build web --release，编译完成后的所有静态产物会生成在项目的build/web目录下
• 在Laravel项目的public目录下新建frontend文件夹，将上一步生成的所有Flutter编译产物全部复制到该文件夹内
• 调整Laravel路由规则，打开routes/web.php，在原有路由（含API路由）的末尾添加兜底路由，所有非API前缀的请求都指向Flutter入口文件：

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

如果需要根路径直接访问Flutter页面，可以直接将Flutter编译产物复制到public根目录，替换原有Laravel的默认首页文件即可，无需额外配置路由。

• 最后直接在Laravel项目根目录执行git push heroku master推送即可，原有Laravel服务和数据库不受影响，Flutter页面可正常访问。

方案二：云端自动编译Flutter Web #

适合需要频繁更新Flutter代码、不想每次本地编译的场景，需要调整Heroku构建配置：

• 将整个Flutter项目源码复制到Laravel项目根目录，命名为flutter_frontend文件夹
• 执行以下命令给Heroku应用添加多构建包，注意顺序不能乱：
  1. 添加Flutter构建包：heroku buildpacks:add https://github.com/dnfield/flutter_heroku_buildpack.git -i 1
  2. 添加Node.js构建包：heroku buildpacks:add heroku/nodejs -i 2
  3. 保留原有PHP构建包：heroku buildpacks:add heroku/php -i 3
• 在Laravel项目根目录新建package.json，添加自动构建脚本，编译后自动将Flutter产物移动到静态资源目录：

{
  "scripts": {
    "build": "cd flutter_frontend && flutter build web --release && cp -r build/web/* ../public/frontend/"
  }
}

• 和方案一一样配置Laravel路由规则，之后每次推送代码到Heroku，云端会自动完成Flutter编译和Laravel服务启动。

内容的提问来源于stack exchange，提问作者Ossama Abd