Angular 5更新后出现Uncaught SyntaxError: Unexpected token : 求助

你遇到的问题大概率是全局依赖版本不兼容导致的——毕竟是执行npm update后才出现异常，而且全新项目都触发错误，完全排除了自定义代码的问题。结合你长期做Angular+Firebase项目的背景，我整理了几个针对性的排查和解决步骤：

1. 检查并回退全局Angular CLI版本 #

Angular 5对应的Angular CLI版本是1.x系列（比如1.7.4是稳定版），如果npm update把你的全局CLI更新到了6.x及以上版本，就会和Angular 5项目产生兼容性冲突。

• 先查看当前全局CLI版本：

  ng --version
  

• 如果版本高于1.x，先卸载全局CLI：

  npm uninstall -g @angular/cli
  

• 安装适配Angular 5的CLI版本：

  npm install -g @angular/cli@1.7.4
  

2. 确认Node.js版本是否符合要求 #

Angular 5对Node.js版本有明确要求：推荐使用Node 8.x LTS版本，如果你的Node版本是10.x及以上，可能会因为语法解析规则的差异导致这个错误。

• 查看当前Node版本：

  node -v
  

• 如果版本过高，建议用版本管理工具（比如nvm）切换到Node 8.x：

  # 切换到Node 8.17.0（Angular 5兼容的稳定版）
  nvm install 8.17.0
  nvm use 8.17.0
  

3. 清理npm缓存并重建项目依赖 #

缓存损坏也可能导致依赖安装异常，尤其是在全局更新后：

• 清理npm缓存：

  npm cache clean --force
  

• 对于已经创建的项目，删除node_modules文件夹和package-lock.json文件，然后重新安装依赖：

  rm -rf node_modules package-lock.json
  npm install
  

• 之后重新启动项目：

  ng serve
  

4. 排查全局Firebase工具的兼容性 #

因为你长期做Angular+Firebase项目，全局的firebase-tools如果被npm update升级到过高版本，也可能和Angular 5项目产生冲突：

• 查看当前全局firebase-tools版本：

  firebase --version
  

• 如果版本高于6.x，卸载后安装适配的版本：

  npm uninstall -g firebase-tools
  npm install -g firebase-tools@6.12.0
  

完成以上步骤后，再尝试用ng new my-app创建新项目并启动，应该就能解决这个语法错误了。

内容的提问来源于stack exchange，提问作者C. Banzet