BabelMinifyWebpackPlugin
用法
module.exports = {
entry: //...,
output: //...,
plugins: [
new MinifyPlugin(minifyOpts, pluginOpts)
]
}
#
minifyOpts
被传递给 babel-preset-minify。 你可以在包目录中找到所有可用的选项。
Default: {}
pluginOpts
- : Test to match files against. Default:
/\.js($|\?)/i
exclude
: Files toexclude
. 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 的一部分,并在插件中进行一些优化。