- 开发工具 vscode
- node 版本：node expected version "^10.13.0 || ^12.13.0 || ^14.15.0 || >=15.0.0".
Debug ViteJS,走进学习源码的第一步
fork 源仓库到你的仓库
从仓库fork最新源码到您的仓库有便于向项目提交PR
clone :clone 项目到你的本地，这里以我的clone仓库为例
# 克隆项目
# cnpmjs
git clone https://github.com.cnpmjs.org/GeekQiaQia/vite.git
# or
git clone https://github.com/GeekQiaQia/vite.git
# 进入项目目录
cd vite
# 安装依赖
yarn / npm install
link vite :cd到vite根目录下 link vite
mono-repo 需要通过link的方式公用多repo项目资源
# vite 根目录
yarn/npm link
启动playground : palyground 用于测试vite所有功能
# vite/packages/playground
我们选择测试vue的测试目录
# vite/packages/playground/vue
# 安装vue项目依赖
yarn/ npm install
# 启动测试项目
yarn / npm run dev
启动vue3.0测试项目：http://localhost:3000/，可针对vite对vue3.0的各项功能测试；
启动vite 项目
# node 版本：node expected version "^10.13.0 || ^12.13.0 || ^14.15.0 || >=15.0.0".
yarn / npm install
# 启动 rollup
yarn / npm dev
此时vite项目生成dist目录：
client文件的内容比较简单清晰，并且我们在启动的palygrund项目中可以直接调试；我们主要以node服务文件debug调试为主；
我们以node服务端文件vite的入口文件cli.ts文件为例，我们在createServer创建开发服务处打debug断点调试；
- 开启vscode 调试模块，选择node.js环境；
- 此时即可进入debug模式，可以根据需要单步断点调试；
- 通过调用栈，我们可以很清楚的知道vitejs的执行流程；
