ASP.NET Core + Angular 12项目中vendor.js缺失、构建后消失及404错误问题求助

嘿，我来帮你梳理清楚这个问题的来龙去脉：

为什么手动加的vendor.js会被ng build删掉？ #

• 首先，ng build执行时会彻底清空并重新生成默认的dist输出目录，如果你是把手动下载的vendor.js放到这个目录里，那每次构建都会被覆盖删除——Angular的构建工具会完全接管输出文件的生成，不会保留你手动添加的内容。
• 更关键的是：Angular 12+ 已经默认不再生成单独的vendor.js文件了！ 从Angular 8开始，官方就调整了打包策略，把原本放在vendor.js里的第三方依赖拆分到多个更小的chunk文件（比如runtime.js、polyfills.js，还有按依赖拆分的独立chunk），不再有单独的vendor.js。你看的教程应该是基于更早的Angular版本（比如Angular 7及以前），版本差异才导致了这个认知偏差。

为啥页面空白还报vendor.js 404？ #

因为你的项目配置（大概率是根目录的index.html）还在引用vendor.js，但Angular 12构建时根本不会生成这个文件，浏览器找不到它，加载失败直接导致页面无法正常渲染，自然就空白了。

怎么解决？ #

• 第一步：修复index.html：打开项目根目录的index.html，找到引用vendor.js的那行代码，直接删掉就行。Angular构建完成后，会自动在dist目录的index.html里注入所有正确的chunk引用，完全不用手动写。
• 第二步：别再手动加vendor.js：完全没必要自己下载这个文件，Angular会自动处理第三方依赖的打包拆分，所有必要的代码都会生成对应的chunk文件。
• 第三步：重新构建：执行ng build（开发环境）或者ng build --prod（生产环境），此时dist目录里虽然没有vendor.js，但所有需要的依赖chunk都齐全了，页面也能正常加载。

补充一句 #

你听说“vendor.js用于生产环境”其实是旧版本的说法，在Angular 12+里，不管开发还是生产环境，都不再生成单独的vendor.js了。生产环境只是会做更极致的代码压缩和分割，但依然是多个小chunk的形式，而非单个vendor.js。

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