babel-loader

babel-loader可以使用option属性来代替.babelrc. 需要注意版本

  1. module: {
  2.         rules: [{
  3.             test: /\.js?$/,
  4.             loader: 'babel-loader',
  5.             exclude: /node_modules/,
  6.             options: {
  7.                 presets: ['react', 'stage-0', ['env', {
  8.                     targets: {
  9.                         browsers: ['last 2 versions']
  10.                     }
  11.                 }]]
  12.             }
  13.         }]
  14.     }

presets:代表字段设定转码规则

  • babel-presets-env 相当于( babel-preset-es2015, babel-preset-es2016, and babel-preset-es2017 together),其targets参数可以设定打包后支持版本，背后参考 browserslist 浏览器支持程度。
  • babel-polyfill

babel在转码的时候只转换语法层面的，这意味着你可以使用新的内置对象比如 Promise 或者 WeakMap, 静态方法比如 Array.from 或者 Object.assign, 实例方法比如 Array.prototype.includes 和生成器函数（提供给你使用 regenerator 插件）。为了达到这一点， polyfill 添加到了全局范围，就像原生类型比如 String 一样。 ，需要安装，然后在项目中直接引用就可以.
import babel-polyfill

  • babel-runtime-transform

babel在打包的过程中会对一些公共方法使用了非常小的辅助代码，比如 _extend。 默认情况下会被添加到每一个需要它的文件中，你可以引入 babel runtime 作为一个独立模块，来避免重复引入。引入 babel-plugin-transform-runtime 并且使所有辅助代码从这里引用，比如开发第三方ui库的时候，可以使用，正常开发可以不使用。
注意: 使用babel-plugin-transform-runtime 必须依赖babel-runtime,可以在.babelrc文件中使用.

如果在用