Heroku管道 - 暂存env变量进入生产

skw*_*eth 11 heroku webpack heroku-pipelines

我最近在Heroku上部署了一个React/Express应用程序,但我遇到了环境变量的问题,这些环境变量是构建应用程序和Heroku部署管道的一部分 - 简而言之,来自应用程序staging发行版的环境变量的值是在推广时继续进行production- 我可以正确设置环境变量的唯一方法是直接推送应用程序production,这首先实际上违背了部署管道的目的.以下是该场景的摘要:

有问题的环境变量是API_URL这样引用的webpack.config.js:

plugins: [
    new webpack.DefinePlugin({
        'API_URL': JSON.stringify(process.env.API_URL || 'http://localhost:4000/api/v1')
    })
]
Run Code Online (Sandbox Code Playgroud)

API本身是另一个带有stagingproduction释放的Heroku应用程序,因此API_URL环境变量的值在我的React app Heroku配置中分别设置为https://staging-api-12345.herokuapp.com/api/v1https://production-api-12345.herokuapp.com/api/v1.

当我推送我的React应用程序时staging,它可以完美地运行 - 但是,当我将应用程序升级到production并首次调用API时,它仍然指向https://staging-api-12345.herokuapp.com/api/v1.好吧,我理解为什么会这样 - 应用程序是在被推送到staging... 时构建的.所以我尝试在推广之后重建应用程序production,但是这不起作用,它仍然使用staging环境变量.

当使用Heroku部署管道时,是否有办法强制应用程序段重建,以便它将捕获不同的环境变量?

Mic*_*iak 10

你不能重建slug,管道的主要目的是在应用程序之间移动相同的slug.

您需要做的是API_URL在运行时获取而不是在构建过程中获取.例如,您可以将所有env放在一个文件中env.js

export const API_URL = process.env.API_URL;
export const OTHER_VAR = process.env.OTHER_VAR;
Run Code Online (Sandbox Code Playgroud)

然后只需在其他文件中导入您需要的内容

import { API_URL, OTHER_VAR } from 'env.js';
Run Code Online (Sandbox Code Playgroud)

  • 对于不使用 Express 的静态应用程序呢? (2认同)