- Published on
vite-1.0源代码解读准备
- Authors
- Name
- 祝你好运
解读准备主要是要能够修改源代码,然后用我们修改后的代码来运行一个test程序,知道具体运行过程中的一些数据,验证我们的推想。 首先说明,我这里只用到了静态调试,也就是打log,在我不明白的地方,输出详细的log。动态调试也可以搞,不过我觉得vite本身的代码并不是特别复杂,所以就没有太大的必要来搞动态调试。
clone源码
- 从[vite]clone代码,
git@github.com:vitejs/vite.git
。 - 切换到
v1.0.0-rc.13
tag所在的位置,git checkout bd448fb7
- 新建一个分支,这样方便后面来回切换,
git checkout -b source-analyze-1.0
- 安装依赖并运行项目
yarn;yarn dev
- 不要关闭上面的命令,新开一个命令行,然后运行
yarn link
。link的意思就是后面我们可以在测试程序中用这个vite,而不是安装到node_modules
下面的那个vite。
注意这一步也可以先fork一下,然后clone自己的,然后后面可以给原仓库提PR
新建并运行测试项目
npm init vite-app TestVite --jsx react
,这里我是用的React,因为我熟悉React,方便我阅读和分析代码。cd TestVite
yarn
yarn link "vite"
yarn dev --debug
这样就可以看到命令行里面有很多log打出来,项目也启动起来了。准备动作就做好了。