Vite的createServer启动源码是如何解析和改写的？

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

目录- 启动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，并打上断点。