Configuration
您可能已经注意到很少有webpack配置看起来完全相同。这是因为webpack的配置文件是导出对象的JavaScript文件。然后,webpack根据其定义的属性处理此对象。
因为它是标准的Node.js CommonJS模块,所以您可以执行以下操作:
- 通过导入其他文件
require(...)
- 在npm上使用实用程序
require(...)
- 使用JavaScript控制流表达式,即
?:
运算符 - 对常用值使用常量或变量
- 编写和执行函数以生成配置的一部分
适当时使用这些功能。
虽然它们在技术上是可行的,但应避免以下做法:
- 使用webpack CLI时访问CLI参数(而是编写自己的CLI或使用
--env
) - 导出非确定性值(调用webpack两次应该导致相同的输出文件)
- 编写长配置(而不是将配置拆分为多个文件)
从本文档中删除的最重要的部分是,有许多不同的方法来格式化和设置webpack配置的样式。关键是要坚持你和你的团队能够理解和维护的一致性。
简单配置
webpack.config.js
var path = require('path');
module.exports = {
mode: 'development',
entry: './foo.js',
output: {
path: path.resolve(__dirname, 'dist'),
filename: 'foo.bundle.js'
}
};