当前位置:首页 > webpack打包优化---IgnorePlugin

webpack打包优化---IgnorePlugin

发布于 2020-03-10 阅读 220 次 webpack

使用

resourceRegExp:匹配(测试)资源请求路径的正则表达式。
contextRegExp:(任选)匹配(测试)资源清单(目录)的正则表达式。

  1. new webpack.IgnorePlugin(resourceRegExp, [contextRegExp]);

忽略moment本地化内容的示例

moment是一个日期格式化的插件,支持各种语言。但是我们使用的时候不一定用到这么多语言包
import moment from ‘moment’

  1. import moment from 'moment'
  2. //设置语言
  3. moment.locale('zh-cn');
  4. let r = moment().endOf('day').fromNow();
  5. console.log(r);

设置语言“zh-cn”说明我们只需要使用这一个语言包,但是打包的时候,整个语言包都会打进去,这就导致了,打包速度慢,打包大的问题。使用IgnorePlugin这个插件可以忽略没有用到的语言包。下面的设置会忽略所有语言包,我们只需要在用到moment的地方手动引入语言包就ok了。

  1. new webpack.IgnorePlugin({
  2. resourceRegExp: /^\.\/locale$/,
  3. contextRegExp: /moment$/
  4. });
  1. import moment from 'moment'
  2. //设置语言
  3. //手动引入所需要的语言包
  4. import 'moment/locale/zh-cn';
  5. moment.locale('zh-cn');
  6. let r = moment().endOf('day').fromNow();
  7. console.log(r);

出处:
https://webpack.docschina.org/plugins/ignore-plugin/
https://blog.csdn.net/qq_17175013/article/details/86845624