如果你已经是一名前端工程师，相信之前或多或少听过、用过 Webpack
这一构建工具，它能够融合多种工程化工具，将开发阶段的应用代码编译、打包成适合网络分发、客户端运行的应用产物。
如今，Webpack已经深深渗入到前端工程的方方面面，几乎已经成为我们日常工作绕不过去的必备基础设施之一。
2009年 Node 与 RequireJS 之前，我们维护代码的方式异常困难（开发与生产环境的隔离管理）。
09之后，前端生态大开，除了环境的隔离管理，诸如ES 6+的普遍使用促使了babel的广泛使用，还是可计算可复用的sass，less。
在这些工程化工具能不同程度弥补浏览器、语言、规范本身的设计缺陷的同时，我们需要一套能融合诸多工程化工具，抹平开发与生产环境的差异的工程化方案。
Webpack 之前社区虽然已经实现了许多模块打包器，例如 Gulp、Grunt、RequireJS 等，但它们或简单合并执行多种构建任务；或聚焦于模块化方案的兼容处理；或仅仅实现 JavaScript 层面的工程化（合并、压缩、混淆）能力，都缺乏一个能够兼容处理所有资源、普适的抽象思维框架。
Webpack 则忽略具体资源类型之间的差异，将所有代码/非代码文件都统一看作 Module —— 模块对象，以相同的加载、解析、依赖管理、优化、合并流程实现打包，并借助 Loader、Plugin 两种开放接口将资源差异处理逻辑转交由社区实现，实现统一资源构建模型，这种设计有很多优点：
所有资源都是 Module，所以可以用同一套代码实现诸多特性，包括：代码压缩、Hot Module Replacement、缓存等；
打包时，资源与资源之间非常容易实现信息互换，例如可以轻易在 HTML 插入 Base64 格式的图片；
借助 Loader，Webpack 几乎可以用任意方式处理任意类型的资源，例如可以用 Less、Stylus、Sass 等预编译 CSS 代码。