使用正确的环境文件将角度应用程序部署到 Heroku

我正在使用 Angular CLI 开发 Angular4 应用程序。 我有环境文件（environments.prod.ts 和environments.dev.ts）。 我想在 Heroku 上创建两个不同的应用程序，每个应用程序使用不同的环境文件，但都从同一个 git 存储库进行部署。

我的应用程序由 NodeJS 服务器交付并在 package.json 文件中运行此脚本：

  "scripts": {
    "heroku-prebuild": "npm install && cd ng-client && npm install && ng build",
    "start": "node ./bin/www"
  },

我的赫罗库procfile看起来像这样：

web:npm start

我知道最终我需要跑步ng build --prod代替ng build.

我正在阅读有关可以传递给 heroku 环境的环境变量的信息。但我如何完成整个周期呢？

Thanks.

您可以创建自己的 bash 脚本，并使用您在 Heroku 上为应用程序设置的环境变量来定义该逻辑。环境变量可以通过编程方式设置，也可以在仪表板上应用程序的设置选项卡上设置。您可以找到有关 Heroku 环境变量的更多信息here https://devcenter.heroku.com/articles/config-vars.

1. 在 Heroku 上的每个环境上配置 env 变量，如果您使用 Node.js，则可以使用NODE_ENV变种例如，开发应用程序将设置为NODE_ENV=development和生产应用程序作为NODE_ENV=production.

2. 在项目的根目录下创建 bash 脚本文件，例如：build.sh:

   #!/usr/bin/env bash
   
   echo "Building Angular app for $NODE_ENV"
   
   build_dev='ng build'
   if [ $NODE_ENV = "development" ]; then
    echo "running $build_dev ..."
    eval "$build_dev"
   fi
   
   build_prod='ng build --prod'
   if [ $NODE_ENV = "production" ]; then
    echo "running $build_prod ..."
    eval "$build_prod"
   fi
   

3. 在以下位置运行您的 bash 脚本heroku-postbuild hook:

   ...
   "heroku-postbuild": "bash build.sh",
   ...
   

您可以修改build.sh根据您的需要。