如何调试 vite

将 github 上的 vite 项目下载到本地
在根目录下执行 pnpm i，下载以来
cd 到 packages/vite/ 目录下，执行脚本 "dev": "rimraf dist && rollup -c -w"，这样就会在 dist 目录下生成 ts 编译后的文件和 sourcemap 文件
调试方法一：现在，你可以直接在 vite 的 ts 文件中打断点，或写 debugger，然后在 vite 仓库的 packages\playground 目录下使用 debugger script 运行项目，就会进入调试页面。调试运行时，断点和 debugger 语句都才会生效；普通运行，只有 debugger 语句会生效。当然了，debugger 进入后，也可以打断点调试了。
调试方法二：或者，你想将 vite 作为一个包来调试下。在你的项目中的 package.json 中写入：

json

"pnpm": {
  "overrides": {
    "vite": "link:../../vite/packages/vite"
  }
}

必须通过 run and debug 来启动，调试的才是 ts 代码。launch.json：

json

{
  "version": "0.2.0",
  "configurations": [
    {
      "name": "Launch via NPM",
      "request": "launch",
      // 使用 PATH 上可用的任何程序（例如 'npm'）
      "runtimeExecutable": "pnpm",
      // 传递给运行时可执行文件的可选参数。
      "runtimeArgs": [
        "dev"
      ],
      // 上面两个配置，相当于执行 pnpm dev
      // 用于启动程序的控制台（internalConsole integratedTerminal externalTerminal）
      "console": "integratedTerminal",
      "type": "node",
      // 因为将 vite 作为依赖进行调试了，所以要配置这个选项。
      // 必须要有这个配置，不然调试的是编译后的 js 代码。
      // 为空代表处理所有地方的 sourcemap
      "resolveSourceMapLocations": []
    }
  ]
}

如何调试 vite ​

如何调试 vite