对webpack的初步研究7

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'
  }
};