loader 被用于转换某些类型的模块，而插件则可以用于执行范围更广的任务。插件的范围包括，从打包优化和压缩，一直到重新定义环境中的变量。插件接口功能极其强大，可以用来处理各种各样的任务。 想要使用一个插件，你只需要 require() 它，然后把它添加到 plugins 数组中。多数插件可以通过选项(option)自定义。你也可以在一个配置文件中因为不同目的而多次使用同一个插件，这时需要通过使用 new 操作符来创建它的一个实例。 ~~~ const HtmlWebpackPlugin = require('html-webpack-plugin'); // 通过 npm 安装 const webpack = require('webpack'); // 用于访问内置插件 const config = { module: { rules: [ { test: /\.txt$/, use: 'raw-loader' } ] }, plugins: [ new webpack.optimize.UglifyJsPlugin(), new HtmlWebpackPlugin({template: './src/index.html'}) ] }; module.exports = config; webpack 提供许多开箱可用的插件！查阅我们的 ~~~ 很少有 webpack 配置看起来很完全相同。这是因为 webpack 的配置文件，是导出一个对象的 JavaScript 文件。此对象，由 webpack 根据对象定义的属性进行解析。 因为 webpack 配置是标准的 Node.js CommonJS 模块，你可以做到以下事情： * 通过 require(...) 导入其他文件 * 通过 require(...) 使用 npm 的工具函数 * 使用 JavaScript 控制流表达式，例如 ?: 操作符 * 对常用值使用常量或变量 * 编写并执行函数来生成部分配置 * 请在合适的时机使用这些特性。 虽然技术上可行，但应避免以下做法： * 在使用 webpack 命令行接口(CLI)（应该编写自己的命令行接口(CLI)，或使用 --env）时，访问命令行接口(CLI)参数 * 导出不确定的值（调用 webpack 两次应该产生同样的输出文件） * 编写很长的配置（应该将配置拆分为多个文件） * 你需要从这份文档中收获最大的点，就是你的 webp