Reactjs 如何基于环境构建预渲染页面

我的要求是预呈现CMS中的页面并存储在S3中。在我的应用程序中，我有.env.development、.env.prod变量，它保存CMS的API端点

我有两个独立的Jenkins工作，一个是开发人员的工作，另一个是prod构建。因此，当我启动Jenkins作业以“npm run build:dev”或“npm run build:prod”的形式构建时，它会从.env.development或.env.prod中定义的CMS api端点获取JSON，并创建版本为“myapp dev-”或“myapp prod-”的构建，并上传到nexus和S3

但是现在的任务是为dev和prod创建一个单一的构建，并且只创建一个版本“myapp-”

---

我的问题是，如何在同一构建版本中基于环境预先呈现页面？

这并不完美，但您可以做到

拥有定制的

distDir

我们将传递不同的环境变量来控制构建目录

let distDir='devBuild'；
if（process.env.BUILD_env==='prod'）{
distDir='prod_build'；
}
如果（process.env.BUILD_env==='stage'）{
distDir=‘阶段构建’；
}

运行两个不同的版本

我们需要使用不同的变量运行2个构建，以生成prod和stage构建。您可以使用

npm run all

使npm脚本更易于阅读

“构建”：“npm全部运行--并行构建：生产构建：暂存”，
“构建：生产”：“构建环境=生产下一次构建”，
“构建：暂存”：“构建环境=暂存下一个构建”，

在单个软件包中发布2个版本

现在在

prod\u build

和

stage\u build

中应该有两个不同的版本。您可以使用单个包版本同时部署它们

您可以从

prod\u build

和

stage\u build

同步到相应的S3存储桶