Vite的createServer启动源码是如何进行详细解析的？

本文共计1258个文字，预计阅读时间需要6分钟。

目录 + 启动Vite的createServer + 使用vite3安装一个Vue工程 + 添加断点并开启调试 + 边调试边理解代码 + 启动Vite的createServer + 为了能了解vite里面运行了什么，通过执行单步调试可更添加加直观的知

目录

• 启动Vite的createServer
• 通过vite3安装一个vue的工程
• 添加断点并开启调试
• 边调试边理解代码

启动Vite的createServer

为了能够了解vite里面运行了什么，通过执行单步调试能够更加直观的知道Vite具体内容。所以这次我们来试着启动Vite的createServer，并进行调试。

通过vite3安装一个vue的工程

进入工作目录，运行下面的代码，项目名称随意，语言用Vue。

npm create vite

进入工程目录安装依赖

添加断点并开启调试

通过vscode打开刚刚生成的项目，通过上一章的内容，可以知道程序的入口是cli.js。所以首先打开node_modules里面vite文件夹下面找到cli.js。找到运行dev时候的主要代码createServer，并打上断点。