webpack和babel项目使用ES6装饰器错误（Decorators are not supported yet in 6.x pending proposal update.）
在webpack和babel项目中，使用ES6装饰器decorator时出错，错误信息如下：
Decorators are not supported yet in 6.x pending proposal update.Webpack的相关配置如下：
loaders: [
{
loader: 'babel',
exclude: /node_modules/,
include: path.join(__dirname, 'src'),
test: /\.jsx?$/,
query: {
plugins: ['transform-runtime'],
presets: ['es2015', 'stage-0', 'react']
}
}
]
解决办法
1、安装babel插件
npm i --save-dev babel-plugin-transform-decorators-legacy2、在.babelrc或webpack中配置该插件
.babelrc配置：
{
"presets": ["es2015", "stage-0", "react"],
"plugins": [
["transform-decorators-legacy"],
// ...
]
}
Webpack配置：
{
test: /\.jsx?$/,
loader: 'babel',
query: {
cacheDirectory: true,
plugins: ['transform-decorators-legacy' ],
presets: ['es2015', 'stage-0', 'react']
}
}
3、使用React Native的情况
使用react-native时，需要安装如下插件：
npm i --save babel-preset-react-native-stage-0【webpack和babel项目使用ES6装饰器错误（Decorators are not supported yet in 6.x pending proposal update.）】.babelrc配置如下：
{
"presets": ["react-native-stage-0/decorator-support"]
}
推荐阅读
- webpack和babel出错（You may need an appropriate loader to handle this file type.）
- AdSense申请失败解决办法（我们发现，您还有一个 AdSense 帐号。每位用户只能拥有一个帐号。要使用此帐号，请关闭另一个帐号。）
- JS如何实现二叉堆（JavaScript实现最小二叉堆和优先队列）
- JavaScript常用数据结构之线性表（数组和链表）
- 数组和链表有什么区别（哪个更快？有什么优缺点？有哪些应用场景？）
- JavaScript常用数据结构（栈(Stack)详解）
- JavaScript基本数据结构（队列基本原理和实现）
- 倒排索引（反向索引）详细介绍
- CSS 动画制作详细指南和代码示例