webpack是用于JavaScript应用程序的静态模块打包工具。主要分为入口（entry）、输出（output）、loader、插件（pulgin）、模式（mode）。

    模块打包运行原理：
    打包流程:

    • 1.读取webpack的配置参数；
    • 2.启动webpack,创建Comilper对象并开始解析项目；
    • 3.从入口文件（erntry）开始解析，并找到其导入的依赖模块，递归遍历分析，形成依赖关系树；
    • 4.对不同的文件类型的依赖模块文件使用对应的Loader进行编译，最终转为JavaScript文件；
    • 5.整个过程中webpack会通过发布订阅模式，向外抛出一些hooks,二webpack的插件可通过监听这些关键的事件节点，执行插件任务进而达到干预输出结果的目的。

    webpack有三大作用：模块打包、编译兼容、能力扩展。可以将不同模块的文件打包整合在一起，保证项目结构的清晰和可读性；通过loader机制，编译转换浏览器无法识别的格式文件，提高开发效率；同时可以进一步实现按需加载、代码压缩，帮助我们提高自动化、工程效率和打包输出的质量。

    优化：

    1. 缩小文件搜索范围（在配置 Loader 时通过 include 去缩小命中范围）
    2. 优化输出质量（减少首屏加载动画，提取组件、按需加载）
    3. 缓存babel编译过的文件loader**:** 'babel-loader?cacheDirectory=true'，选择开启缓存将转译结果缓存至文件系统，则至少可以将 babel-loader 的工作效率提升两倍
    4. happypack多进程编译