Angular 4升级至5后ng serve报错：_this.host.getOutputName is not a function

这个错误我之前帮人排查过好几次，本质是Angular核心依赖包版本不一致，尤其是编译器相关模块和Angular CLI版本没有同步适配Angular 5的API变更导致的。下面是一步步的解决方法：

1. 统一Angular核心依赖版本 #

打开你的package.json，确保所有@angular/开头的依赖（包括@angular/compiler、@angular/compiler-cli）都使用Angular 5的稳定版本（推荐5.2.11，这是Angular 5的最终稳定版）。修正后的依赖示例：

"dependencies": {
  "@angular/animations": "^5.2.11",
  "@angular/common": "^5.2.11",
  "@angular/compiler": "^5.2.11",
  "@angular/core": "^5.2.11",
  "@angular/forms": "^5.2.11",
  "@angular/http": "^5.2.11",
  "@angular/platform-browser": "^5.2.11",
  "@angular/platform-browser-dynamic": "^5.2.11",
  "@angular/router": "^5.2.11",
  "core-js": "^2.5.4",
  "rxjs": "^5.5.11",
  "zone.js": "^0.8.29"
},
"devDependencies": {
  "@angular/cli": "^1.5.8",
  "@angular/compiler-cli": "^5.2.11",
  "@angular/language-service": "^5.2.11",
  // 其他dev依赖保持适配版本
}

注意：Angular 5对应的RxJS版本是5.x，不要升级到6.x；Zone.js对应0.8.x版本，避免版本不兼容。

2. 同步升级Angular CLI版本 #

Angular 5需要搭配1.5.x版本的Angular CLI才能正常工作，执行以下命令安装适配版本：

npm install @angular/cli@1.5.8 --save-dev

3. 清理依赖缓存并重新安装 #

旧的依赖缓存可能残留不兼容的文件，按以下步骤操作：

• 删除node_modules文件夹：
  Linux/Mac：rm -rf node_modules
  Windows：rd /s /q node_modules
• 删除package-lock.json（或yarn.lock如果你用Yarn）文件
• 重新安装依赖：npm install

4. 检查第三方依赖兼容性 #

如果你的项目使用了第三方组件库（比如Angular Material、ngx-bootstrap等），需要确认它们是否支持Angular 5。例如：

• Angular Material对应5.x版本
• ngx-bootstrap对应2.x版本
  如果发现不兼容的库，升级到对应支持Angular 5的版本即可。

完成以上步骤后，再执行ng serve应该就能正常编译运行了。

内容的提问来源于stack exchange，提问作者Ikhlak S.