babel-loader 8.x配置
8.x中各个包的名字变了,都以@符号开头。以前每个包在node_modules目录下都是一个独立的文件夹;现在则在node-modules目录下有个叫“@babel”的目录,这里要安装的所有babel包,都在这个@babel目录下保存。
先安装需要的包
npm intall @babel/core @babel/preset-env @babel/plugin-transform-runtime -D
npm intall @babel/plugin-proposal-class-properties babel-lodaer -D
在根目录创建 .babelrc
复制下面代码
{
"presets": [
"@babel/preset-env",
"@babel/preset-react"
],
"plugins": [
"@babel/plugin-transform-runtime",
"@babel/plugin-proposal-class-properties"
]
}
在webpack.config.js中加入
module: {
rules: [
{ test: /\.js|jsx$/, use: 'babel-loader', exclude: /node_modules/ }
]
}
注:babel-loader8.x中不要babel-preset-stage-0
这个包
不然会有以下报错
ERROR in ./src/index.js
Module build failed (from ./node_modules/babel-loader/lib/index.js)