在visual studio code中用Debugger for Chorme调试JavaScript

在打开的Chorme中进行调试为例(这样不用每次启动调试就打开Chorme)

• 下载Debugger for Chorme

 

• 对Chorme启动设置参数

Google Chorme 右键属性-快捷方式-目标-在尾部添加" --remote-debugging-port=9222"(注意--前面有空格)

 

• 在vscode配置launch.json文件

比如调试的网址为“http://localhost:8080/Default.html ”，

type设置为chorme

request设置为attach

 

{

    "version": "0.2.0",

    "configurations": [

        {

            "type": " chrome",

            "request": " attach",

            "name": "Attach chorme",

            "url": "http://localhost:8080/Default.html",

            "port": 9222,

            "webRoot": "${workspaceRoot}"

        }

    ]

}

 

• 重新打开Chorm

打开网址http://localhost:8080/Default.html

 

• 设置断点调试

左边栏的Local可以自动显示变量，调试中也可以鼠标悬停显示

转载于:https://www.cnblogs.com/riyefu/p/6652502.html