升级Angular 15后Safari出现"SyntaxError: Unexpected token '{"错误排查求助

针对Angular 15升级后Safari出现SyntaxError: Unexpected token '{'（无具体文件行号）的问题，可通过以下步骤定位根源：

• 开启Safari调试的异常断点

  1. 打开Safari偏好设置→高级，勾选「在菜单栏中显示开发菜单」
  2. 打开「开发」菜单→显示Web检查器，切换到控制台标签，勾选「保留日志」「显示时间戳」
  3. 在「调试」菜单中开启「暂停在异常处」（包含未捕获异常），触发错误时会自动定位到对应的代码位置

• 验证Angular编译与降级配置

  • 检查tsconfig.json的compilerOptions.target，指定为ES2017或更低版本，确保输出语法兼容Safari：

    {
      "compilerOptions": {
        "target": "ES2017"
      }
    }
    

  • 确认angular.json中build.options.es5BrowserSupport设置为true，强制开启ES5降级支持
  • 执行ng build --verbose查看构建日志，检查是否有未被转译的文件或依赖

• 排查第三方依赖兼容性

  • 逐步禁用项目中的第三方组件/服务，观察错误是否消失，定位涉事依赖
  • 通过Safari网络标签查看加载的脚本，逐个检查是否存在未转译的新语法（如对象解构简写、箭头函数的特殊写法等）

• 测试不同Safari版本
  使用本地模拟工具测试不同Safari版本，确认是否为特定版本的兼容问题，缩小排查范围

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