并行运行 Angular i18 构建答案

【问题标题】：Runing Angular i18 builds in parallel并行运行 Angular i18 构建
【发布时间】：2019-10-21 01:34:03
【问题描述】：

我的 Angular 应用程序支持 11 种语言，并且我正在使用 Angular 的内置国际化（XLF 文件）。发布版本需要很长时间（因为它构建了应用程序 11 次！）。如何并行运行构建任务（我有一个 4 核 CPU）？

【问题讨论】：

您可以在 package.json 中创建一个 npm 脚本，并将这些构建与 | 或 npm-run-all 模块结合起来，然后并行运行所有构建。看看这里：stackoverflow.com/questions/30950032/….
这可行，但在一项任务中没有 11 个管道。除了对于每一种新添加的语言，都会有代码更改，我对 devops 级别的解决方案更感兴趣
看来您要的是一个开放的issue 6789，Angular 团队正在努力修复它。显然，他们自己在 Google 也遇到了这个问题，所以希望他们能在不久的将来提出解决方案。

【解决方案1】：

因为我不想为将来添加新语言而更改代码（我猜是 DevOps 友好的方法！）我最终编写了一个 shell 脚本（DevOps 将使用它）：

for arg; do \
    echo "Building for $arg"
    ng build --output-path $PROJECT_ROOT/public/$arg \
         --aot \
         --prod \
         --base-href /$arg/ \
         --i18n-file $LANGUAGE_ASSETS_DIR/i18n/$arg.xlf \
         --i18n-format xlf \
         --i18n-locale $arg & \
done
wait

然后添加 i18n npm 任务：

"build:i18n": "bash $PROJECT_ROOT/i18n.sh $LANGS",

和：

LANGS= en de fr ...

ng build 命令末尾的 & 符号是 fork 新进程，这就是使其并行的原因。我能够将构建时间缩短 60%。

这样，所有 DevOps 添加对新语言的支持所需要做的就是将翻译 xlf 文件添加到资产（在我们的案例中单独托管在 AWS S3 存储桶中），然后使用新的语言环境更新 LANGS 环境变量(s) 并最终触发构建任务（无需更改代码）。

编辑：

还需要在for循环的最后加上“wait”命令，等待所有任务完成。

【讨论】：

60% 的改进，非常可观。很好的解决方案@Wildhammer！
谢谢！我有一个带有 4 个线程的核心 i7。如果一个怪物服务器进行构建，它可能会更多。

【解决方案2】：

对于文档：我在 Jenkins 管道中的上述方法

def knownLocales = ["en-CH","en-US","en-GB","de-CH","de-DE"]
def ngAotBuildMap = [:]

steps {
    script {
        for (aot_locale in knownLocales) {
            // beware of how Groovy creates closures in loops
            String aotLocaleClosure = "${aot_locale}"

            ngAotBuildMap[aot_locale] = {
                sh """
                    echo "Building locale ${aotLocaleClosure}"
                    cd $WORKSPACE/webclient
                    rm -R -f $WORKSPACE/webclient/dist/${aotLocaleClosure}/
                    ng build --no-progress --configuration=${params.PARAM_SPRING_PROFILE}-${aotLocaleClosure}
                """
            }
        }

        // https://stackoverflow.com/questions/37333796/using-failfast-with-closure-map-breaks-parallel-step/37356318
        ngAotBuildMap.failFast = true
        parallel ngAotBuildMap
    }
}

然而：对于顺序构建，1 个 AOT 构建需要 3 分钟 30 秒，对于 5 个语言环境总共需要大约 18 分钟。使用上述脚本，1 个 AOT 构建需要 15 分钟 30 秒，总时间几乎没有变化。我猜在我的情况下，服务器资源在顺序构建中已经用完了，所以并行构建不会增加太多。

【讨论】：

是的，这完全取决于您的 CI/CD 实例类型和大小。自从我写这篇文章以来，我们实际上已经将我们的平台迁移到了 Kubernetes，现在我们支持 18 种语言。我现在使用的是一个用于构建的 docker 映像（将语言环境作为输入，捆绑作为输出），并且只是将各个语言环境构建作业分布在我们的机器上。使用这种方法，具体取决于集群中可用的机器数量，理论上 18 个构建可以与一个构建一样快。