angularjs - main.js(compiled js-files) 来自 Angular 工件的文件替换另一个构建工件

Question

我们有多个环境，我们有具有后端配置的环境文件，我们在构建期间使用这些文件。示例：ng build --c UAT

但是我在这里有一个问题，现在我们决定只构建一次并部署多个环境相同的工件。

我知道使用 Angular 服务和 APP_INITIALIZER 令牌可以实现这一点，但由于某些原因我们不能使用它。

所以我决定在构建之后，用各自的 env 配置值修改编译的 js 文件（main.js）。但是由于环境变量及其模式的数量增加，它变得越来越困难。

所以我想到了下面的过程，请建议它可以使用或者我不应该

1，我将使用“ng build --c UAT”构建 UAT webpack(dist/artifact)。

2，我会为所有其他环境做同样的事情，现在我总共有 3 个 dist 文件夹（webpacks）。

3、我会将 UAT 工件部署到所有环境，但在将其部署到 Preprod 之前，我会将“main.js”文件替换为 Preprod 工件 main.js 文件，因为只有 main.js 文件具有所有环境配置。并保持所有其他 js 文件相同。

4，我将重复与产品部署相同的内容。

请就这种方法提出建议。

标签： angularjswebpackdevopsartifactorycontinuous-deployment

Answer 1

您做出了一个很好的选择来决定针对特定环境的构建，因为它们总是会回来困扰您。但是通过您的方法，您只是转移了问题，因为您仍然需要调整构建工件。当您的配置是高度动态的时，我建议您重新考虑不使用服务在运行时动态加载数据的决定，或者至少说明为什么这种方法不适合您的约束。

假设您仍然想依赖静态文件内容，那么您可能会对文章如何使用环境变量来配置您的 Angular 应用程序而不需要重新构建感兴趣。它建议从嵌入式env.js脚本加载数据，并将其作为 Angular 服务从那里公开。虽然有人可能会争辩说这也只会进一步转移问题，但它至少可以让您的构建工件保持不变。例如，如果您从 nginx docker 容器运行您的应用程序，您可以env.js在网络服务器启动之前动态替换值。我正在使用这种方法的简化版本，虽然它仍然感觉有点 hacky，但它确实有效！祝你好运！