webpack4下的ES6转ES5和兼容IE的配置

1、如下图，如果我们用了es6的语法，会在IE9、IE10下报错

2、安装依赖

执行命令：npm install  @babel/core  @babel/preset-env  babel-loader  -D
@babel/core提供了es6转es5的功能
@babel/preset-env提供了解析js语法的配置

3、新增.babelrc文件，添加下面代码

{
  "presets": ["@babel/preset-env"]
}

4、修改webpack配置，扩展rules

{
    test: /\.js$/,
    loader: 'babel-loader',
    include: path.join(__dirname, 'src'),
    exclude: '/node_modules/'
}

5、结果

注意：如果按照上述步骤还是不成功，建议删除【node_module】目录再试一次