2. vscode调试JavaScript代码

1. 在扩展中查找 debugger for chrome插件，点击安装
   

2. vscode选择引用js的html所在的文件夹后，配置launch.json文件
   

3. 配置launch.json文件，注意下边的Chrome 安装路径和html文件的名字

   {
       // 使用 IntelliSense 了解相关属性。 
       // 悬停以查看现有属性的描述。
       // 欲了解更多信息，请访问: https://go.microsoft.com/fwlink/?linkid=830387
       "version": "0.2.0",
       "configurations": [
           {
               "type": "chrome",
               "request": "launch",
               "name": "Launch Chrome against localhost",
               "url": "http://localhost:8080",
               "webRoot": "${workspaceFolder}"
           },
           {
               "type": "chrome",
               "request": "attach",
               "name": "Attach to Chrome",
               "port": 9222,
               "webRoot": "${workspaceRoot}"
           },
           {
               "name": "使用本机 Chrome 调试",
               "type": "chrome",
               "request": "launch",
                "file": "${workspaceRoot}/index.html",//引用js的html文件
           //  "url": "http://mysite.com/index.html", //使用外部服务器时,请注释掉 file, 改用 url, 并将 useBuildInServer 设置为 false "http://mysite.com/index.html
               "runtimeExecutable": "C:\\Program Files (x86)\\Google\\Chrome\\Application\\chrome.exe", // 改成您的 Chrome 安装路径
               "sourceMaps": true,
               "webRoot": "${workspaceRoot}",
           //  "preLaunchTask":"build",
               "userDataDir":"${tmpdir}",
               "port":5433
           }
       ]
   }
   
   

4.在js文件中设置断点后，选择本地chrome进行调试，点击f5，进行调试