Angular v6报错：‘装饰器中不支持函数调用’问题咨询

我来帮你搞定这个问题！你遇到的两个错误其实是紧密关联的——Angular 6对TypeScript版本有严格的兼容性要求，而你当前用的TS 2.8.3超出了它的支持范围，这才导致.forRoot()这种模块导入方式触发了编译警告。

问题根源拆解 #

• Angular 6的编译器明确要求TypeScript版本必须满足 >=2.7.2且<2.8.0，你的2.8.3不在这个区间内，这直接破坏了编译器对装饰器语法的处理逻辑。
• 虽然Angular 5搭配TS 2.8.3还能正常运行，但Angular 6收紧了版本限制，.forRoot()作为装饰器内的函数调用，刚好触发了编译器的新检查规则，于是就出现了那个“装饰器中不支持函数调用”的错误。

具体解决方案 #

1. 降级TypeScript到符合要求的版本 #

这是核心解决步骤！打开项目根目录的package.json文件，找到typescript的版本配置，把它改成符合区间的版本，比如"typescript": "~2.7.2"，然后执行安装命令更新依赖：

npm install
# 如果你用yarn的话就执行
yarn install

2. 确认.forRoot()的使用位置正确 #

确保你的.forRoot()调用是放在@NgModule的imports数组里，以ngx-bootstrap的Tooltip模块为例，正确写法应该是这样：

import { TooltipModule } from 'ngx-bootstrap/tooltip';

@NgModule({
  imports: [
    // 这里是正确的位置
    TooltipModule.forRoot()
  ]
})
export class AppModule { }

别把.forRoot()放到declarations或者providers这类其他数组里，那样也可能触发类似错误。

3. 清理编译缓存并重新构建 #

有时候旧的编译缓存会残留问题，执行以下命令清理后重新编译：

ng clean
ng build --prod

如果是开发环境，直接重启ng serve就行。

额外提醒 #

Angular的每个大版本都会对TS版本有明确的兼容性要求，后续升级框架的时候，一定要先确认好对应的TS版本范围，避免版本不匹配带来的各种奇怪问题。比如Angular 6对应TS 2.7.x，Angular 7对应TS 3.1.x，以此类推。

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