Skip to main content

本地调试

在 VSCode 中调试#

方法一:使用 Auto Attach#

VSCode 已经通过 auto attach 能力比较容易的支持了调试(不需要配置),打开方式如下。

info
  • 1、必须在 VSCode 中启动才能 auto attach(按 command+shift+P,打 auto attach 开启自动附加进程)

打开之后,VSCode 会有下面的提示。

对你想要开启调试的命令增加 --debug  选项即可。比如:

{  "scripts": {    "dev": "cross-env ets && cross-env NODE_ENV=local midway-bin dev --ts --debug"  }}

这样在 dev  时将会自动进行调试。

方法二:使用 JavaScript Debug Teminal#

在 VSCode 的终端下拉出,隐藏着一个 JavaScript Debug Terminal ,点击它,创建出来的终端将自带调试能力。

输入任意的命令都将自动开启 Debug,比如输入 npm run dev  后。

方法三:配置调试文件#

创建一个 vscode 的启动文件。

随便选一个,会创建 .vscode/launch.json 文件,

将下面内容复制进去。

{  // 使用 IntelliSense 了解相关属性。  // 悬停以查看现有属性的描述。  // 欲了解更多信息,请访问: https://go.microsoft.com/fwlink/?linkid=830387  "version": "0.2.0",  "configurations": [    {      "name": "Midway Local",      "type": "node",      "request": "launch",      "cwd": "${workspaceRoot}",      "runtimeExecutable": "npm",      "windows": {        "runtimeExecutable": "npm.cmd"      },      "runtimeArgs": ["run", "dev"],      "env": {        "NODE_ENV": "local"      },      "console": "integratedTerminal",      "protocol": "auto",      "restart": true,      "port": 7001,      "autoAttachChildProcesses": true    }  ]}

启动断点即可。

在 WebStorm/Idea 中调试#

开始配置 IDE。

配置 npm 命令。

选择你的 package.json  后,下拉选择 Scrips ,其中是你 package.json  中配置好的 scripts  中的命令,选择你要的命令,比如 dev  或者 test  等即可 。

在代码上断点后执行调试即可。