Angular 如何加快角度构建过程_Angular_Angular Cli

Angular 如何加快角度构建过程

angular

Angular 如何加快角度构建过程,angular,angular-cli,Angular,Angular Cli,在我的TypeScript文件中做了一些更改之后，每个构建都需要20分钟以上。我运行这个命令：ngbuild--output path=..\..\static\angularjs 如果我在Microsoft PowerShell中运行它，需要25-30秒。这是很多时间环境视窗10 8GB内存皮查姆64 MS PowerShell 如何加快速度？我的应用程序花了28秒构建，但我已将时间缩短到9秒。使用此标志 ng build --source-map=false 通过比较时间，您可

在我的TypeScript文件中做了一些更改之后，每个构建都需要20分钟以上。我运行这个命令：

ngbuild--output path=..\..\static\angularjs

如果我在Microsoft PowerShell中运行它，需要25-30秒。这是很多时间

环境

视窗10
8GB内存
皮查姆64
MS PowerShell

如何加快速度？

我的应用程序花了28秒构建，但我已将时间缩短到9秒。使用此标志

ng build --source-map=false

通过比较时间，您可以看到时间上的差异：

ng build --stats-json 

ng build --stats-json --source-map=false

源代码映射仅用于调试，希望它有助于根据使用

--build optimizer=false

加快构建。我发现，对于我来说，这个问题是通过使用

watch

标志解决的，即

ng build --watch=true

这将持续运行，并仅在保存时自动生成文件。它已将我的构建时间从8秒减少到，而在开发模式下，您可以将开发的此标志更改为

"buildOptimizer": false

这对我有用。角度7.

这将我的构建时间减少到50%

          "optimization": false,
          "outputHashing": "none",
          "sourceMap": false,
          "extractCss": true,
          "namedChunks": false,
          "showCircularDependencies": false,
          "aot": true,
          "extractLicenses": false,
          "statsJson": false,
          "progress": false,
          "vendorChunk": true,
          "buildOptimizer": false,

您可以使用节点参数

--max\u old\u space\u size

如

node --max_old_space_size=4096 ./node_modules/.bin/ngbuild --prod --build-optimizer

但我更喜欢通过环境进行设置：

NODE_OPTIONS=--max-old-space-size=4096

它两次加快了我们在CI管道上的构建过程。

添加了一个答案，该答案可能只与较新的Angle版本（10及更高版本）相关

我发现混合使用

CommonJS

和

AMD

依赖关系是我的罪魁祸首

angular build（角度构建）过程会发出以下类型的警告，表明您处于这种情况：

Warning: xxxxxx.ts depends on 'yyyyyy.js'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

在这种状态下，我自己的重建时间是无法忍受的，大约6分钟-请注意，这是一次重建-这意味着它只是为了保存一个修改过的typescript文件：

Build at: 2021-05-28T07:39:58.559Z - Hash: 5f8c96f22c3daf60faa2 - Time: 234429ms

但当我删除攻击性引用时，初始构建时间下降到80秒左右，重建时间下降到7-8秒

诚然，您可能并不总是能够删除对攻击性模块的引用，但在我的例子中，我能够为本地调试这样做，并在部署时保留它们。这大大加快了我的开发速度。

ng build是否发出任何输出？它是否指示哪些步骤较慢？

输出路径是dist
目录的替代路径。没有其他指标。可能是wsl2 hepls如果您删除任何调试TS文件的方法，这对开发人员没有帮助，是吗？我是开发人员，这非常有帮助。我没有100%的时间需要调试信息（我仍然会得到一些不言自明的错误）。我希望这能在我开发新东西的时候节省很多时间。对我来说，完整构建的编译时间从35秒增加到23秒。对于一个ng发球
来说，从22秒到16秒。哇，老兄。我欠你一杯啤酒！这也适用于ng serve并加快刷新速度。。。源映射不仅仅用于调试。它还能够支持使用真实代码引用而不是缩小变量名e tc的生产。我相信watch
模式在这个问题上不被视为构建。OP搜索加速部署的整体构建过程的方法，而不是在开发中。感谢Tomas的反馈。我添加这个答案是因为我可以想象其他人会来回答这个问题，而这个答案正是他们所需要的（就像我需要的一样）。你能解释一下为什么你认为watch
mode不被视为构建吗？OP谈到了“TypeScript文件中的一些更改”，所以我认为这将是一个有价值的答案。在watch
模式下，Angular将只重建更改后的代码块，因此速度要快得多，但它并不反映整个生产构建过程，此时所有文件都需要编译、树震动和绑定。因此，禁用watch
将加快每个后续构建（但不是第一个构建）的开发过程（在本地开发中，每个文件更改都可以分配给单个块），这将完全不会影响生产构建。但是，是的，OP提到的一些变化
可能表明他指的是开发（不是发布/构建本身）过程。请在回答中添加一个注释，这将影响开发过程构建速度，而不是构建部署，我很高兴收回我的反对票。嗨@Tomas，我已经改进了nivlac的答案。您认为这能更好地回答问题吗？注释听起来很有用，您能解释每个选项吗？我确实查阅了ng build文档，但没有找到有用的解释。@TheViralGriffin查看选项section@dota2pro我的意思是，例如，有一个选项叫做“extractLicenses”，在文档中，它说“extractLicenses”将所有许可证提取到一个单独的文件中。在这种情况下，我们谈论的是哪些许可证。因此，我建议，如果可能的话，如果您知道这些选项的作用，您可以向他们简要介绍，以便访问帖子的人可能会发现它非常有用。@dota2pro您将这些配置选项放在哪里？在angular.json文件中？我会在“showCircularDependencies”中留下：true，因为这可能是糟糕代码的根--build optimizer在使用“aot”选项时启用“@angular devkit/build optimizer”优化。这是最简单有效的解决方案之一。要设置最大旧空间大小的适当值，请查看官方文档。例如，在一台具有2GB内存的机器上，考虑将此设置为1536（1.5 GB），以留出一些内存用于其他用途，避免交换。“我使用RXJS COMPATE第一运算符能够在可观察到的情况下执行。你知道有没有类似的东西吗？通过谷歌搜索但没有成功。。。