解决：对修饰器的实验支持是一项将在将来版本中更改的功能。设置+"experimentalDecorators"+选项以删除此警告。

配置Babel与ESLint兼容装饰器

最新推荐文章于 2025-05-28 08:49:35 发布

原创最新推荐文章于 2025-05-28 08:49:35 发布 · 1.1w 阅读

4 ·

CC 4.0 BY-SA版权

文章标签：

#es6 #eslint #装饰器 #报错

磕磕绊绊专栏收录该内容

17 篇文章

订阅专栏

本文介绍如何通过安装特定的Babel插件和支持装饰器的配置项解决JavaScript项目中装饰器语法与Babel及ESLint之间的冲突问题。

首先安装一个依赖包yarn add babel-plugin-transform-decorators-legacy -D，这种写法会将依赖包加载到devDependencies中，而不是dependencies第一个是只用于开发环境，第二个要用于生产环境。所以生产环境中用不到的包就可以直接添加到第一个里面就好了。

安装了依赖包之后，在根目录下面新建一个.babelrc来覆盖一些eslint的默认操作。

{
    "presets": [
      "env",
      "stage-0"
    ],
    "plugins": ["transform-decorators-legacy"]
}

这样可以保证编译的时候不报错了，但是你会发现被装饰器装饰的方法或者类下面会有小红线，这样可以在根目录下面新建jsconfig.json

{
"compilerOptions": {
    "experimentalDecorators": true,
    "target": "es2017"
},
"exclude": [
    "node_modules",
    "dist"
],
"include": [
    "src",
    "env",
    "static"
]

}

这样一来是不是感觉世界都清净了呢。