Angular 7+中ngc-webpack替代方案与构建选型咨询

1. 是否可以直接移除ngc-webpack依赖 #

绝对不能直接删。
从你贴的webpack配置看，这套构建是基于早年AngularClass的angular-starter模板改的，ngc-webpack在里面承担核心编译职责：一方面对接Angular的ngc编译器实现AOT编译、TS代码转译，另一方面负责把Angular组件的模板、样式依赖正确接入webpack的依赖树。你的配置里既把ngcWebpackConfig.loaders直接展开注入了模块加载规则，也在插件数组里注册了NgcWebpackPlugin，直接移除依赖会立刻导致TS文件、Angular组件无法被识别编译，构建直接失败。
顺带提一句，你贴的配置里const ngcWebpack = require();这行本身就是语法错误，正常老版本写法应该是require('ngc-webpack')，这行不改就算装了依赖也会报错。

2. Angular 7+ 下ngc-webpack的替代方案 #

ngc-webpack官方停更后没有完全对等的同类型独立维护插件，目前可落地的成熟方案有两个：

• 替换为官方维护的@ngtools/webpack：这是Angular CLI底层默认使用的编译组件，和Angular 7及以上所有版本完全兼容。替换步骤非常直接：
  • 卸载ngc-webpack，安装和当前Angular版本号完全一致的@ngtools/webpack包
  • 把配置里原来的ngcWebpackConfig.loaders替换为@ngtools/webpack的loader规则，匹配项目下的.ts文件
  • 把原来的ngcWebpack.NgcWebpackPlugin替换为@ngtools/webpack提供的AngularWebpackPlugin，传入tsConfigPath、入口文件路径等和原有配置一致的参数即可
    需要注意：你配置里用的CommonsChunkPlugin是Webpack 3的内置API，Angular 7适配的Webpack 4已经废弃了这个插件，必须替换为SplitChunksPlugin，否则就算换了编译插件构建也跑不通。
• 如果不想自己维护Angular编译链路，可以用@angular-builders/custom-webpack：这个包专门用来给Angular CLI扩展自定义webpack配置，已经把@ngtools/webpack的编译逻辑全部封装好了，你只需要把自己项目里的特殊loader、插件规则抽出来传入即可，不用手动处理Angular编译相关的配置。

3. 放弃自定义webpack迁移到Angular CLI是否可行 #

这是投入产出比最高、长期维护成本最低的方案，完全可行：

• 你现在用的这套自定义webpack模板是Angular 2/4时代的产物，距今已有近8年时间，里面大量依赖和API都已经被淘汰：除了ngc-webpack停更，inline-manifest-webpack-plugin、老版本的raw-loader/file-loader/css-loader、CommonsChunkPlugin都和新版Webpack、新版Angular不兼容，自己逐行改配置适配的工作量，远大于迁移到Angular CLI的工作量。
• 你不用担心迁移后原来的自定义逻辑没法用：Angular CLI从7版本开始就支持自定义webpack配置扩展，你现有配置里的全局注入jQuery、组件级样式转字符串处理、静态资源拷贝、自定义HTML注入规则、chunk排序这些需求，要么CLI原生支持，要么通过@angular-builders/custom-webpack加几行配置就能实现，不需要完全抛弃原有构建逻辑。
• 后续版本升级成本会大幅降低：Angular官方提供了跨版本的自动升级脚本，从Angular 7一路升级到最新版本时，CLI会自动处理大部分构建配置的适配工作，不需要你每次升级都手动调整webpack配置适配Angular编译器的变更。

迁移的时候建议走增量迁移路径：先创建一个和当前项目Angular版本一致的空CLI项目，把src目录下的业务代码迁移过去先跑通基础构建，再逐步把自定义构建逻辑加上，比直接在老项目上硬改踩坑少很多。

内容的提问来源于stack exchange，提问作者Scorpion_Beardo