Angular 16项目在Safari 13.1中出现Unexpected token '='错误排查咨询

1. 开启Safari开发者工具 #

打开Safari偏好设置，进入「高级」选项卡，勾选「在菜单栏中显示开发菜单」。点击顶部菜单栏的「开发」，选择对应页面的「显示Web检查器」。

2. 从控制台深挖错误线索 #

• 在Web检查器的「控制台」面板，勾选「保留日志」后刷新页面复现错误。点击错误条目旁的展开箭头，查看完整调用栈，部分场景下会关联到具体脚本文件。
• 若错误来自第三方脚本，控制台会标注脚本URL，点击可直接跳转到「源」面板查看对应代码片段。

3. 排查ES语法兼容性问题 #

Unexpected token '='大概率是因为Angular 16输出了Safari 13.1不支持的ES语法（比如类字段直接赋值class Demo { value = 0 }）：

• 检查tsconfig.json的target配置，确保设置为ES2019或更低版本（Safari 13.1对ES2020部分特性支持不全）。
• 查看angular.json的build配置，确认browserlist包含safari >= 13.1，让Angular CLI自动做语法降级处理。

4. 关闭代码压缩定位原始错误 #

临时修改angular.json的build配置，将optimization设为false，重新构建项目后在Safari运行。未压缩的代码会保留原始行号和文件名，错误信息会直接指向出错的代码位置。

5. 逐一排查懒加载模块与第三方依赖 #

• 若项目用了懒加载模块，可临时注释部分懒加载路由，逐个启用模块来锁定错误来源。
• 检查第三方依赖版本，部分库默认输出高版本ES语法，需替换为兼容Safari 13.1的版本，或通过@babel/preset-env手动转译依赖代码。

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