插件可以完成更多 loader 不能完成的功能。
Use plugins to add functionality typically related to bundles in webpack.
比如 BellOnBundlerErrorPlugin 可以在build的过程中给出错误提示.

内置 plugins

插件的使用一般是在 webpack 的配置信息 plugins 选项中指定。

  1. // webpack should be in the node_modules directory, install if not.
  2. var webpack = require("webpack");
  3. module.exports = {
  4. plugins: [
  5. new webpack.ResolverPlugin([
  6. new webpack.ResolverPlugin.DirectoryDescriptionFilePlugin("bower.json", ["main"])
  7. ], ["normal", "loader"])
  8. ]
  9. };

其它 plugins

Webpack 本身内置了一些常用的插件,还可以通过 npm 安装第三方插件。:

  1. npm install component-webpack-plugin

可以这么使用:

  1. var ComponentPlugin = require("component-webpack-plugin");
  2. module.exports = {
  3. plugins: [
  4. new ComponentPlugin()
  5. ]
  6. }

当通过npm安装第三方插件时候建议用这个工具:webpack-load-plugins
它会检查你的依赖里面的所有第三方插件并懒加载之.

See also