概要：

在Visual Studio Code簡稱VS Code開發(fā)工具中，如何對一些使用前端開發(fā)技術(shù)，例如：Vue 開發(fā)的前端項目進行斷點調(diào)試？本章節(jié)來介紹，如何配置調(diào)試環(huán)境、如何在代碼中設(shè)置斷點、如何啟動斷點調(diào)試、以及如何解決在調(diào)試過程中可能遇到的問題。

Visual Studio Code中斷點調(diào)試最終效果.gif

實際開發(fā)中，我們的前端項目的調(diào)試，一般都是打開瀏覽器中的開發(fā)者工具(F12)然后找到應(yīng)對的JS文件進行打斷點調(diào)試。但如果想在VS Code中 ，它也能像Visual Studio 后端開發(fā)的環(huán)境中一樣，直接打斷點調(diào)試，程序運行到相關(guān)邏輯就能馬上命中斷點。那豈不美哉?。?！接下來就在VS Code中實現(xiàn)這簡單又方便的斷點調(diào)試操作。

1.配置調(diào)試環(huán)境