在慕课网Redux+React Router+Node.js全栈开发的学习中我遇到了一个问题
当使用react-redux的@connet装饰器时发生了报错,为什么编辑的和学习视频中相同,但会报错,而且运行后也产生了error。
当时我的package.json中用的是“transform-decorators-leagacy”这个插件,在项目中安装的是"babel-plugin-transform-decorators-legacy": "^1.3.5",
"plugins": [
"transform-decorators-legacy",
[
"import",
{
"libraryName": "antd-mobile",
"style": "css"
}
]
]
产生了错误:Error: The 'decorators' plugin requires a 'decoratorsBeforeExport' option, whose value must be a boolean. If you are migrating from Babylon/Babel 6 or want to use the old decorators proposal, you should use the 'decorators-legacy' plugin instead of 'decorators'.
这是因为上面的配置是使用babel6时的配置,而在 npm run eject时,安装的版本时babel7.x,与之前的配置不适应。
这需要重新安装适应的配置器,于是进入npm官网查询
https://www.npmjs.com/package/babel-plugin-transform-decorators-legacy
它提示如果你使用吧babel7.x时需要yarn add @babel/plugin-proposal-decorators --dev
更改package.json配置如下:
"plugins": [
["@babel/plugin-proposal-decorators", { "legacy": true }],
[
"import",
{
"libraryName": "antd-mobile",
"style": "css"
}
]
]
如果vscode还有错误提示,需要在根目录添加:jsconfig.json
{
"compilerOptions": {
"experimentalDecorators": true
}
}