使用带有构建变量的 AWS Code Pipeline 部署 React App

Question

我希望将 create-react-app 作为静态站点部署到 AWS S3。正在使用 CodePipeline 编排构建。

我们的代码库有在构建过程中注入的 REACT_APP_**** 变量。如何为管道的 QA 和 Prod 阶段注入不同的变量。这些变量指向后端和身份验证系统的不同配置。

作为管道的一部分，CodeBuild 只运行一次，因此无法弄清楚如何为 QA 和 Prod 注入不同的变量。

Answer 1

在您的 buildspec 文件中，您可以使用 build list 定义为 QA 和 Prod 并行运行的具有不同环境变量的构建。

batch:
  build-list:
    - identifier: qa_build
      env:
        variables:
          REACT_APP_VAR1: qa_val_1
          REACT_APP_VAR2: qa_val_2
          REACT_APP_VAR3: qa_val_3
    - identifier: prod_build
      env:
        variables:
          REACT_APP_VAR1: prod_val_1
          REACT_APP_VAR2: prod_val_2
          REACT_APP_VAR3: prod_val_3

由于每个构建都有自己独立的工件，因此您需要配置管道来处理此问题。 This documentation page 提供了这种配置的示例。