一、Babel介绍

Babel 是一个工具链，主要用于将 ECMAScript 2015+ 版本的代码转换为向后兼容的 JavaScript 语法，以便能够运行在当前和旧版本的浏览器或其他环境中

Babel官网

二、webpack 转义ES6

1. 安装相关依赖包

npm i babel-core babel-loader@7 babel-plugin-transform-runtime –D
npm I babel-preset-env babel-preset-stage-0 –D

2. 在根目录新建.babelrc文件，并写入如下代码

{
    "presets" : ["env", "stage-0"],
    "plugins" : ["transform-runtime"]
}

3. 配置webpack.config.js文件,新增如下代码

  module: {
    rules: [
      {
        test:/\.js$/,
        use: 'bable-loader',
        include: /src/,          // 只转化src目录下的js
        exclude: /node_modules/  // 排除掉node_modules，优化打包速度
      }
    ]
  }, // 处理对应模块

4. 在src/index.js中增加如下代码

let a = 1
const b = 2

5. 打包后，打开dist/bundle.js，查看第97行，可以看到let、const已经被转义为ES5语法的代码了

   
   ES6转ES5

Babel介绍
Babel使用介绍
es6入门