我在哪里可以找到Angular CLI 7.3.9默认生成的webpack设置文件，以便我可以基于它构建覆盖

Question

我想为Angular CLI v7.3.9生成的项目扩展webpack构建过程。

我发现我必须使用这个工具：https://github.com/just-jeb/angular-builders/tree/7.x.x/packages/custom-webpack

这似乎是一个很好的解决方案，但不幸的是，我找不到任何关于扩展现有Angular CLI配置文件的示例。

我的意思是，我想看看Angular CLI已经为我生成了什么，然后我才能想到我应该在自定义生成器覆盖配置中使用的正确覆盖。作为webpack的新手，我需要了解已经存在的内容，以便能够找出我可以调整的内容，以避免完全破坏项目。

我在哪里可以找到Angular CLI默认生成的webpack设置文件，以便我可以基于它构建覆盖

更具体地说，问题是为生产构建项目大约需要25分钟。这是一个包含数百个表单和网格组件的大型项目，我看到当前的构建过程在ModuleConcatenationPlugin中花费了大约20分钟，在TerserPlugin中花了5分钟，而没有对计算机资源造成任何严重负载。我听说ModuleConnectinationPlugin被弃用，我想也许我可以使用更好的东西(UglifyJS？optimization.contenateModules？(，但一开始我必须了解Angular CLI是如何使用它的，这样我才能正确地覆盖它。

Answer 1

从技术上讲，在angular cli中，从v5开始(据我所知(，您就有了ng eject，它将允许您访问webpack配置。

Answer 2

您可以使用ngx构建加

示例：

• 添加ngx构建加：ng add ngx-build-plus

• 将文件webpack.partial.js添加到(子(项目的根目录：

const webpack = require('webpack');
module.exports = {
plugins: [
new webpack.DefinePlugin({
"VERSION": JSON.stringify("4711")
})
]
}

• 在app.component.ts中使用全局变量VERSION：

import { Component } from '@angular/core';
declare const VERSION: string;
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
title = 'Version: ' + VERSION;
}

• 使用指向部分webpack配置的--extra webpack config开关启动应用程序：

ng serve --extra-webpack-config webpack.partial.js -o

如果您的项目是基于CLI的子项目，也可以使用--project开关：

ng serve --project getting-started -o --extra-webpack-config webpack.partial.js

更新你可以看看他们的文档，这里是完整的配置