环境治理策略

不同的环境对webpack的配置有不同的要求，比如：

• 开发环境需要使用 webpack-dev-server 实现 Hot Module Replacement；
• 测试环境需要带上完整的 Soucemap 内容，以帮助更好地定位问题；
• 生产环境需要尽可能打包出更快、更小、更好的应用代码，确保用户体验。

主流的环境治理策略是将不同的环境需要的配置配置在对应的文件中，然后对应的启动命令配置成对应的config文件，webpack —config webpack.development.js，或者通过命令指定env参数，比如：webpack —config webpack.config.js —env -production，这种方式需要在webpack的配置文件中对环境变量进行判断，根据环境执行不同的配置。
对于第一种方式，其配置文件可这样组织：

└── config
  ├── webpack.common.js
  ├── webpack.development.js
  ├── webpack.testing.js
  └── webpack.production.js

webpack.commom.js是最基本的配置文件，其余环境相关的文件可以借助来和common进行配置合并。webpack-merge用法类似 Object.assign 等类似，不过支持更多的特性：

// 支持数组属性合并
merge({ arr: [1] }, { arr: [2] }) === { arr: [1, 2] }
// 支持函数属性合并
const res = merge(
  { func: () => console.log(1) },
  { func: () => console.log(2) }
);
res.func();
// => 1,2