基本原理

概念：

webpack用于解决前端的模块化开发需求，帮助在项目中管理维护相关资源。webpack依据配置的入口文件开始，对引用到的所有资源文件通过其loader机制编译转换为js代码后进行打包。

打包结果运行原理

webpack打包结果是一个立即执行函数，接收一个modules数组。调用时传入一个数组，数组内元素是参数列表相同的函数，每一个函数就对应源代码中一个模块。每个模块代码就是被包裹在这一个函数体中，从而实现了私有作用域。

webpack工作函数如图：

函数内部定义了缓存模块的对象，一个用于加载模块的require函数并在其之上挂载了一些数据和工具函数。最后调用执行require，传入参数模块id 0，开始加载模块。模块id就是模块数组的元素下标，从这开始加载源代码的入口模块。