转译 JS
安装
1
2
3
4
5
6
7
8
9
10
11
12#babel转译 核心代码 和 所需插件集合
npm install -D babel-loader @babel/core @babel/preset-env
#支持 @decorators 语法
npm install -D @babel/plugin-proposal-decorators
#支持类语法
npm install -D @babel/plugin-proposal-class-properties
#复用 babel 生成的各种 helper 函数,并提供沙箱环境避免污染全局
npm install --save-dev @babel/plugin-transform-runtime
npm install --save @babel/runtime-corejs3配置
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19module: {
rules: [
{
test: /\.m?js$/,
exclude: /(node_module|bower_components)/,
use: {
loader: "babel-loader",
options: {
presets: ["@babel/preset-env"],
plugins: [
["@babel/plugin-proposal-decorators", { legacy: true }],
["@babel/plugin-proposal-class-properties", { loose: true }],
["@babel/plugin-transform-runtime", { corejs: 3 }],
],
},
},
},
],
},
校验 JS
安装
1
npm install -D eslint eslint-loader babel-eslint
配置
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15module: {
rules: [
{
enforce: 'pre',
test: /\.js$/,
exclude: /node_modules/,
loader: 'eslint-loader',
},
{
test: /\.js$/,
exclude: /node_modules/,
loader: 'babel-loader',
},
],
},在 .eslintrc.json 中,将 babel-eslint 配置成 eslint 的解析器:
1
2
3
4
5
6{
"parser": "babel-eslint",
"parserOptions": {
//...
},
}