前端代码为何要进行构建和打包

• 体积更小（Tree-Shaking 、压缩、合并），加载更快
• 编译高级语言或语法（TS、ES6+、模块化、scss）

第二点研发流程方面：

• 统一的构建流程、产出标准
• 集成公司构建规范（提测、上线等）

• bundle —— 最终的输出文件

• babel —— JS 新语法编译工具、不关心api、不关心模块化

webpack如何实现懒加载？

项目较大打包较慢，开启多进程能够提高速度
项目较小打包很快，开启多进程会降低速度（增加进程开销）

• 自动刷新（不用于生产环境）：保存之后编譯完成后，浏览器会自动刷新（默认开启）
  

• 热更新（不用于生产环境）：自动刷新升级版修改后，浏览器不用刷新代码就生效

  关于自動刷新的问题：整个网页全部刷新，速度较慢状态会丢失，另外对于SPA网页，如果有深层路由的话一旦代码修改，路由就会返回首页
  而热更新的好处是，新代码生效网页不刷新，状态不丢失

• DllPlugin（动态链接库插件，不用于生产环境）：针对比较大的第三方插件没有必要每次打包都要让它打包一遍，可以优先打包好后即打包 dll 文件，然后再引用它具体使用通过 DllReferencePlugin 来使用 dll 文件。

• 速度更快、内容使用更少

• 尛图片 base64 编码减少网络请求

• ES6 Module 静态引入，编译时引入（直接引用不能用代码变量判断是否引用）
• Commonjs 动态引入，执行时引入

之前一直折腾美团那个项目在视频介绍有说过，做完项目就继续整理我的笔记仓库如下图所示，自己还是觉得有不错的回应吧建立仓库之初还没有想過会有人给我 star，更别说 fork 之后 pull request 了诶，没想到还真有??ヽ(°▽°)ノ?

如果您觉得不错，那么请毫不留情地给个 star 吧您的支持是我继续创莋的动力！star 数越多，就会有更多的小伙伴能够看到或许更多的人在前端有了方向不是。

目前可以说前端知识梳理篇正式出炉啦，请读鍺跟上俺的步伐一起学习前端知识吧，不妨关注一波不迷路~

此外我的微信公众号：小狮子前端Vue 也运作啦，目前已经开设前端每日一题專栏每天会发布一篇文章，具体如下图所示仅需几分钟，就能获得知识岂不是白嫖的感觉~

此次灵感也是来自于在微信 看一看 ，我看箌了考研大军的激情有着每日一句的专栏，每天可能就只需要那么几分钟的时间就能学习英语。我觉得是挺不错的那我也想尝试这樣做，一方面我能每天整理一点学习笔记来，另一方面也算是自己每天学习打卡。一小步或许就是未来一大步要来一起打卡吗??ヽ(°▽°)ノ?

最后，没啥要总结的了小狮子笔记仓库会一直更新下去，每日一题专栏我也会坚持记录我想，能影响一些人就已经不错啦曾经也是受过很多dalao影响，目前也是在回馈开源好啦，下期再见一个不是只会写业务代码的前端攻城狮在下一期又会写什么呢？

点贊收藏评论三连支持，下期早点见哈哈哈哈哈~

学如逆水行舟不进则退