jenkins 中 webpack 的 config.js 中 Octopus 变量替换的策略

Question

我正在开发一个 ES6 AngularJS 项目，我使用 webpack 将所有内容捆绑到dist/app.js.

我正在使用的 CI/CD 堆栈是 SCM - Jenkins - Octopus：

1. 我的代码更新已推送到存储库

2. Jenkins 克隆存储库，调用npm install并gulp使用它gulp-webpack从一个入口点捆绑和缩小所有内容并将其放入dist/app.js

3. 构建后，Jenkins 将应用程序打包到 nuget pkg 中，并将其推送到 Octopus Deploy，其中应用程序部署到 IIS

章鱼项目在多个环境中工作，我必须有一种方法来根据环境替换一些配置变量。为此，Octopus 提供了“替换文件中的变量”部署步骤。

当我不使用模块捆绑器和 ES6 时，我只会有一个配置文件来设置一些我随后使用的角度常数。我会有一个config.js文件和一个config.template.js文件。Octopus 将替换文件中的变量config.template.js，我只需将其设置为替换config.js为config.template.js部署后。

然而现在，我只是使用一个普通的config.js导出我需要使用的变量，然后将其导入到相关的文件中（例如包含角度控制器函数的文件）。

通过这种设置，我无法像以前那样进行替换，因为我的config.js意志只是包含在dist/app.js. 谁能帮我想出一个如何实现这一目标的策略？我想在构建之前进行config.js-交换，然后让 Octopus 替换整个包中的变量，但这似乎效率相当低。config.template.jsapp.js

Answer 1

我们在构建过程中遇到了类似的情况，并且同样感到困惑。我们决定采用代码内令牌替换解决方案，使用 JS 本身来确定令牌是否已被替换，以便它可以在本地开发（预部署）中工作。

我们添加了这样的代码：

// config --------------------------
(function () {
    // These values will be replaced by Octopus during deployment.
    var configuredApiUrl = "#{Api:Url}";
    apiUrl = (configuredApiUrl[0] !== "#") ?
        configuredApiUrl : "http://api.local/v1";        
})();

然后我们在输出文件上设置变量替换。

我希望这有帮助！