怎么在vscode中调试js代码

怎么在vscode中调试js代码

在左侧扩展中搜索debugger for chrome并点击安装

怎么在vscode中调试js代码

在自己的html工程目录下面点击f5,或者在左侧选择调试按钮

怎么在vscode中调试js代码

选择下拉按钮,会有一个添加,选择chrome

怎么在vscode中调试js代码

之后会出现laungh.json的配置文件在自己的项目目录下面

怎么在vscode中调试js代码

不过对于不同的代码文件要调试的话,每次都需要修改一下配置文件

  1. {    "version": "0.2.0",    "configurations": [{            "type": "chrome",            "request": "launch",            "name": "Launch Chrome against localhost",            "url": "http://localhost:8080",            "webRoot": "${workspaceRoot}"        },        {            "type": "chrome",            "request": "attach",            "name": "Attach to Chrome",            "port": 9222,            "webRoot": "${workspaceRoot}"        },        {            "name": "Launch index.html (disable sourcemaps)",            "type": "chrome",            "request": "launch",            "sourceMaps": false,            "file": "${workspaceRoot}/jsTest/test1/test1.html"  #每次需要修改这里的文件地址        }    ]}

登录后复制

到这里就可以进行调试了,在

怎么在vscode中调试js代码

中选择 Launch index.html (disable sourcemaps) 调试项,按f5调试,会出现,同时打开goole浏览器,点击

怎么在vscode中调试js代码

即可进入调试阶段。

相关文章教程推荐:vscode教程

以上就是怎么在vscode中调试js代码的详细内容,更多请关注【创想鸟】其它相关文章!

声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。

点点赞赏,手留余香

给TA打赏
共0人
还没有人赞赏,快来当第一个赞赏的人吧!
    编程技术

    vscode更换主题无效

    2025-4-2 7:32:50

    编程技术

    vscode下python无法F5代码

    2025-4-2 7:33:00

    0 条回复 A文章作者 M管理员
    欢迎您,新朋友,感谢参与互动!
      暂无讨论,说说你的看法吧
    个人中心
    购物车
    优惠劵
    今日签到
    私信列表
    搜索