引言 webpack中文官网：https://webpack.docschina.org/concepts/ webpack是一个javascript常用的静态模块打包工具，通过配置webpack，可

1. webpack plugin机制实现原理是怎样的。 2. 如何自定义一个plugin。 3. compiler和compilation的区别。 4. Tapable是什么？有哪些钩子？如何使用？

公司的h5项目越来越大，打包进度展示2万+模块, 尽管从webpack2升级到webpack4，冷启动仍需三分多钟，热更新10s左右，占用电脑内存也大，开发体验较差；决定在运行项目中引入vite

最近公司构建vue项目越来越慢了。vue2主项目生产构建需要10分钟，而本地也需要6分钟左右。子项目也个个5分钟左右。每次发布都被吐槽到想死。作为公司一个有追求的前端，总想着如何去优化下。奈何vuec

本文是我的前端面试系列的工具篇，汇总整理了webpack和Git的常见面试题，后续的复习过程中随时会对本文查漏补缺。如有不当之处，欢迎指正，感谢。

多页面应用程序，顾名思义是存在多个入口，每个业务都有自己的页面。每一次页面跳转的时候，server 会拉取一个新的 HTML 文档返回给客户端，页面重新加载此新文档，并且资源被重新下载。

webpack作为目前主流的前端构建工具，我们几乎每天都需要与它打交道。是一个足够开放的类库，提供了可插拔的方式去自定义一些配置，包括配置 loader和plugin，本篇我们主要讨论loader

实际开发中我们都需要使用构建工具对代码进行打包，TS同样也可以结合构建工具一起使用，今天我们以webpack为例介绍一下如何结合构建工具使用TS。

本篇文章主要记录了webpack最常用的配置，包括开发环境的配置，生产环境的配置。还记录了常用的优化手段，包括构建速度优化和体积优化。