[英]Missing class properties transform react
I know there are many questions/answers out there but none of them seems to help me resolve my issue. 我知道这里有很多问题/答案,但是似乎没有一个问题可以帮助我解决问题。 I don't understand what is wrong with my setup: 我不明白我的设置有什么问题:
Here is my webpack.config.js: 这是我的webpack.config.js:
var path = require('path');
module.exports = {
entry: './src/index.js',
output: {
path: path.resolve(__dirname, 'dist'),
filename: 'ftux-components.js',
library: "shared-components",
libraryTarget: "umd"
},
module: {
loaders: [
{
test: /\.jsx?$/,
exclude: /(node_modules)/,
loader: 'babel',
query: {
presets: ['env', 'react', 'es2015', 'stage-0'],
plugins: ["transform-class-properties"]
}
},
{
test: /\.s?css$/,
loaders: ['style', 'css', 'sass', 'postcss-loader']
},
{
test: /\.(ttf|eot|svg|jpg|png|woff)$/,
loader: 'url-loader'
}
],
rules: [
{
test: /\.js$/,
include: path.resolve(__dirname, 'src'),
exclude: /(node_modules|bower_components|build)/,
use: {
loader: 'babel-loader',
options: {
presets: ['env']
}
}
}
]
},
externals: {
react: {
root: 'React',
commonjs2: 'react',
commonjs: 'react',
amd: 'react'
},
'react-dom': {
root: 'ReactDOM',
commonjs2: 'react-dom',
commonjs: 'react-dom',
amd: 'react-dom'
},
'styled-components': {
commonjs: 'styled-components',
commonjs2: 'styled-components',
amd: 'styled-components'
}
}
};
Here's my babelrc: 这是我的babelrc:
{
"presets": ["env", "react", "es2015", "stage-0"],
"plugins": [
"transform-class-properties",
"transform-object-rest-spread",
"transform-react-jsx"
]
}
I tried reordering presets, adding appropriate plugins (transform-class-properties), deleting reinstalling node_modules but nothing seems to help. 我尝试重新排序预设,添加适当的插件(transform-class-properties),删除重新安装的node_modules,但似乎无济于事。 My npm and node is up-to-date, also tried using this to make sure I included everything I need for babel. 我的npm和node是最新的,还尝试使用它来确保我包括了babel所需的一切。 Any suggestions? 有什么建议么?
In your babel loader you're not including the plugin for class properties even though you already have it installed. 在babel loader中,即使您已经安装了类属性插件,也没有包含它。 Try making your loader look like this: 尝试使您的装载机看起来像这样:
{
test: /\.jsx?$/,
exclude: /(node_modules)/,
loader: 'babel',
query: {
presets: ['env', 'react', 'es2015', 'stage-0'],
plugins: ["transform-class-properties"]
}
},
Okay I figured it out. 好吧,我知道了。 I needed to include presets and plugins in the rules array in module object in webpack.config.js: 我需要在webpack.config.js的模块对象的rules数组中包括预设和插件:
rules: [
{
test: /\.js$/,
include: path.resolve(__dirname, 'src'),
exclude: /(node_modules|bower_components|build)/,
loader: 'babel-loader',
query: {
presets: ['env', 'react', 'es2015', 'stage-0'],
plugins: ["transform-class-properties"]
}
}
]
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.