目的：
在vscode里，直接F5打開html頁面，并且可以在編輯器里，進行斷點調試js代碼。
準備工作：
1、VSCode 軟件
2、js項目
3、VSCode 上裝一個插件：Debugger for Chrome
配置文件更改：
1、用VSCode裝載項目
2、然后按F5，出現這個框，選擇 Chrome
3、然后出現個配置的提示，并打開了launch.json這個文件
添加如下信息：
???????{ ????????????"name":?"使用本機?Chrome?調試", ????????????"type":?"chrome", ????????????"request":?"launch", ?????????????"file":?"${workspaceRoot}/index.html", ????????//??"url":?"http://mysite.com/index.html",? ????????//使用外部服務器時,請注釋掉?file,?改用?url,?并將?useBuildInServer?設置為?false?"http://mysite.com/index.html ????????????"runtimeExecutable":?"C:Program?Files?(x86)GoogleChromeApplicationchrome.exe",? ????????????//?改成您的?Chrome?安裝路徑 ????????????"sourceMaps":?true, ????????????"webRoot":?"${workspaceRoot}", ????????//??"preLaunchTask":"build", ????????????"userDataDir":"${tmpdir}", ????????????"port":5433 ????????}
結果如圖：
4、更改調試方式
如圖：選擇左邊的圓形按鈕，然后出來這個調試配置管理界面，選擇“使用本機 Chrome 調試”
5、最后在項目的 js 處設置好斷點，按 F5，就可以進行斷點調試了。
相關文章教程推薦：vscode教程
? 版權聲明
文章版權歸作者所有，未經允許請勿轉載。
THE END
喜歡就支持一下吧
