Angular CLI构建版本报错如何调试？部署后控制台异常排查

我之前在部署Angular项目时也碰到过类似的诡异问题——本地ng serve完全正常，构建部署后就弹出模糊的bundle错误。结合踩过的坑，给你几个实用的排查和解决方向：

第一步：先定位到源码中的错误位置 #

现在控制台只显示编译后bundle的错误，根本找不到具体是哪段代码出问题。你可以修改构建命令，开启sourcemap来映射源码：

ng build --dev --bh /home/ --source-map

重新部署后，浏览器控制台的错误就会显示对应的源码文件和行号，这样就能精准定位问题了。

针对两个错误的具体排查方向 #

1. TypeError: (void 0) is not a function #

这个错误通常是调用了一个未被正确定义的函数，常见原因有：

• 第三方依赖库没有被正确打包：有些库在开发环境（ng serve）下能正常加载，但构建后因为tree-shaking或者打包配置问题被排除了，导致运行时找不到函数。你可以检查angular.json里的构建配置，确认依赖都被正确包含。
• 代码中的条件逻辑导致函数被误删：如果你的代码里有类似if (false) { someFunction() }的死代码，Angular的构建优化可能会把someFunction删掉，但如果运行时这个条件意外为真，就会报错。

2. TypeError: Cannot read property 'dirty' of undefined #

这个基本和表单控件相关，大概率是：

• 模板里绑定了某个表单控件的dirty属性，但组件中对应的FormControl或FormGroup没有被初始化。比如你在模板写了[disabled]="myForm.get('name').dirty"，但myForm在组件里还没实例化就被模板调用了。
• 开发模式下Angular有更宽松的检查，可能没触发这个错误，但构建后的代码（即使是--dev模式）会更严格，就暴露了问题。

额外检查：基础路径配置是否正确 #

你用了--bh /home/设置基础路径，要确认服务器上的部署路径确实是/home/，如果路径不匹配，可能导致脚本或资源加载异常，间接引发这类错误。可以先去掉--bh参数，用默认基础路径部署测试，看错误是否消失。

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