BabiliWebpackPlugin

安装

npm install babili-webpack-plugin --save-dev

使用

// webpack.config.js
const BabiliPlugin = require("babili-webpack-plugin");
module.exports = {
  entry: //...,
  output: //...,
  plugins: [
    new BabiliPlugin(babiliOptions, overrides)
  ]
}

选项

babiliOptions

babiliOptions会被传递到babili preset。可以查阅 https://github.com/babel/babili/tree/master/packages/babel-preset-babili#options. Default: {}。

Overrides

test: JS文件拓展名正则表达式。默认： /\.js($|\?)/i
comments: 保留注释。默认： /@preserve|@licen(s|c)e/。使用假值来移除所有的注释。接收函数，具有test（正则）属性的对象，以及值这几种类型。
sourceMap: 默认：使用 webpackConfig.devtool。通过这个设置来重写。
babel: 通过自定义babel-core代替。 require("babel-core")
babili: 通过自定义babili preset来代替。 require("babel-preset-babili").

为什么

你也可以对于webpack使用babel-loader并且包括babili作为一个预设，这样应该会更快 - 因为babili将操作更小的文件。但是，那么，为什么这个插件存在？

webpack loader对单个文件操作，并且babini preset作为webpack loader将考虑每个文件在浏览器全局范围内（默认情况下）直接执行，并且不会优化顶级范围中的一些事情。这将会发生变化，你可以选择优化在顶级范围进行有话 - babel/babili#210, babel/babili#203，等..
当您通过运行babel-loader来排除node_modules时，babili优化不会应用于被排除的文件，因为它不会通过minifier来传递。
When you use the babel-loader with webpack, the code generated by webpack for the module system doesn't go through the loader and is not optimized by babili.
当你将babel-loader和webpack一起使用的时候，webpack为模块系统生成的代码不会通过loader，并且不会被babili优化。
webpack插件可以对整个chunk/bundle输出进行操作，并且可以优化整个包，您可以看到压缩后的输出中的一些差异。但这可能会有一点慢，因为文件通常很大。所以还有另一个想法，我们可以应用一些优化作为loader的一部分以及对插件进行一些优化。