BabelMinifyWebpackPlugin

用法

  1. module.exports = {
  2. entry: //...,
  3. output: //...,
  4. plugins: [
  5. new MinifyPlugin(minifyOpts, pluginOpts)
  6. ]
  7. }

#

minifyOpts 被传递给 babel-preset-minify。 你可以在包目录中找到所有可用的选项

Default: {}

pluginOpts

  • : Test to match files against. Default: /\.js($|\?)/i
  • exclude: Files to exclude. Default: undefined
  • comments: 保留注释。默认:/^\**!|@preserve|@license|@cc_on/,falsy 值将移除所有注释。可以接受函数,带有属性匹配(正则)的对象和值。
  • sourceMap: Configure a sourcemap style. 默认:webpackConfig.devtool
  • : 配置具有特殊解析器选项的 babel。
  • babel: 传入一个自定义的 babel-core。默认:require("babel-core")
  • minifyPreset: 传入一个自定义 babel-minify preset 代替原来的。默认:require("babel-preset-minify")

你也可以在webpack中使用,引入 minify 作为一个预设并且应该运行的更快 - 因为 babel-minify 将运行在更小的文件。但是,这个插件为什么还存在呢?

  • webpack loader 对单个文件进行操作,并且 minify preset 作为一个 webpack loader将会把每个文件视为在浏览器全局范围内直接执行(默认情况下),并且不会优化顶级作用域内的某些内容。要在文件的顶级作用域内进行优化,请在 minifyOptions 中设置 mangle: { topLevel: true }
  • 当你排除 node_modules 不通过 babel-loader 运行时,babel-minify 优化不会应用于被排除的文件,因为它们不会通过 minifier。
  • 一个 webpack 插件可以在整个 chunk/bundle 输出上运行,并且可以优化整个bundle,你可以看到一些细微的输出差异。但是,由于文件大小通常非常大,所以会慢很多。所以这里有 - 我们可以将一些优化作为 loader 的一部分,并在插件中进行一些优化。

维护人员