webpack打包产物解析及原理（含cjs/esm/代码分离/懒加载） 以下结论都是是通过一步一步实际测试，然后分析打包产物，来解析原理 以小见大，先从简单的入手 先纯cjs，在纯esm，在混用，在分

webpack 是我们现阶段要掌握的重要的打包工具之一，我们知道 webpack 会递归的构建依赖关系图，其中包含应用程序的每个模块，然后将这些模块打包成一个或者多个 bundle。 莫慌，我们一点点拆分开看，其实总体的文件就是一个 IIFE——立即执行函数。 函数的入参 mo…

Webpack 一直都是有些人的心魔，不清楚原理是什么，不知道怎么去配置，只会基本的 API 使用。它就像一个黑盒，让部分开发者对它望而生畏。 而本节最大的作用，就是帮大家一点一点的消灭心魔。

如果有不了解webpack的同学，可以自行到webpack官网学习基础的配置，这里我们主要一起学习常见的插件应用。 loader用于打包文件，plugins 用于解决一些其他任务，比如去注释等等。 1. HTML文件生成插件：html-webpack-plugin 产生背景：多…

什么是 webpack？ webpack 能干什么？ webpack 怎么用？ 太多的入门教程了，一搜一大把，不再说了，而且 webpack 的官方文档应该是文档届的标杆了，太详细了，由浅入深，从玩具类型的初级 Level，到深度优化的生产环境下产品级别的高级 Level 都讲…

还是以前一样，有些概念面试可能会考，我都用*标记了出来，两句话就总结清楚其余的地方如果你想了解webpack，就仔细看看，虽然本教程不能让你webpack玩的很6，但是懂操作流程够了。面试你一般问你webpack的原理，Loader的原理，你有用那些优化措施 前端开发已经模块化…

三篇长文带你解锁 Webpack ，希望读完这三篇文章，你能够对 webpack 的各项配置有一个更为清晰的认识。 webpack 是一个现代 JavaScript 应用程序的静态模块打包器，当 webpack 处理应用程序时，会递归构建一个依赖关系图，其中包含应用程序需要的每…

[实践系列] 主要是让我们通过实践去加深对一些原理的理解。 [实践系列]你能手写一个 Promise 吗？Yes I promise。 有兴趣的同学可以关注 [实践系列] 。 求 star 求 follow~ 入口起点(entry point)指示 webpack 应该使用哪个…

1. 引入扫描工具的初衷 目前在梳理前端应用时发现很多代码不规范的地方，包括简单的js问题以及代码格式化的问题，造成了代码可读性下降，另外各种历史代码也是“风格迥异”，一个应用是被来自”五湖四海“人共同维护，难不免有”广式烧腊、天津狗不理“各种口味，更难免的还有”臭味相投“的，…