使用 azure devops 发布管道部署 Vue.js 应用程序

Question

我有一个使用 vue-cli 3 创建和构建的 vue.js 应用程序。我有一些环境变量.env.test和.env.prod文件。

要构建应用程序，我使用了一个 azure devops 构建管道，我在其中运行命令： npm run build:test或 npmrun build:prod

这会生成不同的工件，这些工件是在 azure devops 发布管道中为 Stage 输入的。

我面临的问题是我不想为每个环境单独构建。我想构建一个并部署到不同的环境，这可能吗？

我如何处理这些变量来为所有环境构建一次包？这是一个好习惯吗？或者我应该像现在一样为不同的环境使用不同的管道？

Answer 1

从CI的角度

build pipeline无论运行的环境如何，都应该只有一个可以构建工件。

.env.prod可能被用于部署工件的任何环境（Development，Production等）

您必须提供带有令牌的配置，这些令牌将在部署/发布阶段被替换：

env_key1=#{token_key1}#
env_key2=#{token_key2}#
env_key3=#{token_key3}#

因此，只需为所有环境使用单个配置文件构建项目和发布工件。

从CD的角度

我会建议使用单release pipeline以多级（Development，Production，等）。

提供单独的variables groups基于stages. 它允许将变量分开，按逻辑分组并Azure Key Vault用作秘密来源。变量名必须等于环境标记（没有前缀和后缀）。

将Task您想要的任何内容添加到 中Stage，这将找到并替换令牌。

目前，我使用Replace Tokens来自市场的扩展。取决于stage，将替换不同的变量组。Replace Tokenstask 自动完成所有工作，ei 扫描js文件并替换令牌。默认令牌前缀和后缀是：#{ }#，但任务允许提供您希望的自定义​​。