断点调试

除了 @debug 标签外，您还可以使用各种工具和开发环境中的断点来调试 Svelte 和 SvelteKit 项目。这包括前端和后端代码。

以下指南假设您的 JavaScript 运行时环境是 Node.js。

Visual Studio Code

使用内置的调试终端，您可以在 VSCode 中源文件中设置断点。

1. 打开命令面板：CMD/Ctrl + Shift + P。
2. 查找并启动“调试：JavaScript 调试终端”。
3. 使用调试终端启动您的项目。例如：npm run dev。
4. 在您的客户端或服务器端源代码中设置一些断点。
5. 触发断点。

通过调试面板启动

您也可以在您的项目中设置一个.vscode/launch.json。要自动设置一个

1. 转到“运行和调试”面板。
2. 在“运行”选择菜单中，选择“Node.js...”。
3. 选择与您的项目对应的“运行脚本”，例如“运行脚本：dev”。
4. 按下“开始调试”播放按钮，或按F5开始断点调试。

这是一个launch.json示例

{
	"version": "0.2.0",
	"configurations": [
		{
			"command": "npm run dev",
			"name": "Run development server",
			"request": "launch",
			"type": "node-terminal"
		}
	]
}

进一步阅读：https://vscode.js.cn/docs/editor/debugging。

其他编辑器

如果您使用其他编辑器，这些社区指南可能对您有所帮助

• WebStorm Svelte：调试您的应用程序
• 在 Neovim 中调试 JavaScript 框架

Google Chrome 和 Microsoft Edge 开发者工具

可以使用基于浏览器的调试器调试 Node.js 应用程序。

请注意，这仅适用于调试客户端 SvelteKit 源映射。

1. 使用 Node.js 启动 Vite 服务器时运行--inspect标志。例如：NODE_OPTIONS="--inspect" npm run dev
2. 在新标签页中打开您的网站。通常在localhost:5173。
3. 打开浏览器的开发者工具，然后单击左上角的“为 Node.js 打开专用 DevTools”图标。它应该显示 Node.js 徽标。
4. 设置断点并调试您的应用程序。

您也可以通过在 Google Chrome 中导航到chrome://inspect或在 Microsoft Edge 中导航到edge://inspect来打开调试器开发者工具。

参考

• 调试 Node.js