Webpack系列：第四回
以前面的先验内容为铺垫，本文将会仔细的介绍webpack的基本打包思路，最终目标，手撕一个自己的webpack。
前期准备首先再次重申一个重点：webpack的根本目的,是为了将我们写的代码转换成浏览器能够执行的代码,并且将分散的各个模块，揉成一个统一的文件。然后直接在index.js中引入即可那么我们的mywebpack.js的目标就是一个，从入口文件读取各个模块，生成转换后的代码，写到bundle.js文件，成功与否检验的标准就一个，index.html引入该bundle.js，看看浏览器能否正确显示。
实际讲解之前，准备好一些相关的文件。index.html、index.js、helloGirl.js和hello.js、template模板文件，当然还有我们最为重要的mywebpack.js。
// 1. 其中index.js入口文件，四段极为工整的代码块。：
import helloGirl from "./helloGirl.js";
const helloWorldStr = helloGirl();
function component() {
const ...
Webpack系列：第三回
本文可以看成是我们开始diyWebapck前的开胃内容，介绍一些必备的知识点，为之后做铺垫。babel相关api的功能。
@babel/parser：能够将通过readfile读取的文件内容，转化为ast数据。使用方式: const parser = require(“@babel/parser”);
借助https://astexplorer.net/, 查看结果。示例代码中的四段代码分别对应body中的四种类型。
重点关注body字段。由图中能清楚的看到，左侧完整的四段代码块，解析出来的ast数据，对应着body中的四个不同类型节点。
@babel/traverse：遍历ast中所有节点，根据需求，重写节点内容
@babel/types: 构建新的babel的ast类型数据
@babel/generator：与parser为互逆操作，ast–> 字符串数据
ejs： 模板生成。
从总体的逻辑，大概介绍下webpack最终的产物bundle.js生成的逻辑generateCode入参就是我们已经处理好的ast， ...
Webpack系列：第二回(前端模块化迭代史)
前端模块化的演进历程模块化是webpack的基石，本文就尝试着缕一缕。
阶段一：文件划分最原始的方法就是文件划分。其具体操作就是第一回中我们举的a、b、c三个js文件的例子。
// 文件内部结构：
var x = 100
function A() {
...
}
function B() {
...
}
然后通过script标签引入：
<script src="./moduaA.js"></script>
<script src="./moduaB.js"></script>
<script src="./moduaC.js"></script>
该方法的弊端显而易见，所有模块共用全局作用域，变量全局污染，命名冲突在所难免。，且模块之间的依赖关系难以控制。
阶段二：命名空间同样还是三个文件，只是文件内部的所有内容，都是用一个对象包裹，对外使用时则通过这个对象。
var modulA = {
x = 100,
methodA: function A() { ...
Webpack系列：第一回
本文开始， 我们尝试深入理解一下前端神器webpack。最终的目标：能够理解前端模块化，理解webpack打包的核心思路及执行，理解webpack中的“关键人物”。解锁这三点，最终彻底掌握。
Webpack干啥的打包用的，简单说就是将项目的各种零散的文件揉成一个完整的js。比如我们的项目一共用到了a.js,b.js,c.js共三个文件，打包后就成了一个bundle.js。那问题来了，为什么要打包？我就喜欢零散的，咋了？
客观存在的需求
其一： 零散文件使用，各个文件之间的依赖关系顺序，需要人为的梳理。比如在a文件里用到了b文件的某个属性，那么，b文件就应该先于a文件加载，否则error。可想而知此等操作，项目的复杂度一上来，开发人员直接崩溃。
其二： 零散文件意味着，请求的数目随文件个数线性放大。那么遵循不发请求或者少发请求的终极性能准则，此方法依旧鸡肋。
因此，我们的神器webpack应运而生。当然啦，除了他还有很多其他的如gulp、parcel等的工具，非独此一款。
webpack具体的能力
合并文件。在项目中，我们可能会到处import各种依赖，这些依赖又分布在各个文件中。we ...
Pantheon-Upload Intelligence
Recently, with some free time on my hands, I binged an AMC drama called Pantheon. Maybe dealing with mundane chores for too long made me lose interest in gazing at the stars, but this show instantly pulled me back in. It also introduced me to a new concept: UI (Upload Intelligence).
The idea of Upload Intelligence is to completely digitize the data of a physical human brain, converting it into a “cloud” existence that can be copied and pasted—essentially the fundamental step toward human immorta ...
Preparing the Preliminary Actions
The new-era software laborer is the official term for people working in software development (hehe), and today the group roughly splits into frontend and backend. Their roles are well-defined, and occasionally there are full-stack masters who can handle every tricky issue without batting an eye (but are exhausted to the bone).
Putting aside the backend Java ecosystem, a single frontend role already offers endless topics to study. The three frameworks—Angular, Vue, React—do you master all of them ...