開發人員可以使用Chrome和VS code調試Angular應用程序。當然，也可以直接將Chrome配置為附加。
首先，需要在VS code中安裝擴展。
程序員可以在https://github.com/Microsoft/vscode-chrome-debug網站下載或直接在插件的擴展標籤中搜索：
安裝完成後，可能需要啟用該插件並重新啟動VS code，但最終可以看到正常的文件夾結構。然後，轉到調試選項卡，通過按鈕創建一個新配置，並選擇“Chrome”環境。
執行此操作後，擴展會創建一個新的文件夾，其名稱為“.vscode”，其中包含“launch.json”，最初如下所示：
文件夾結構可以告訴我們，文件是從根目錄提供的。
因此，“webRoot”：“${workspaceRoot}”“設置對我們來說很好，我們將打開一個新的Chrome實例，但它需要一個現有的運行服務器，所以如果你使用像lite-server這樣的東西，你可以輕鬆地在Web應用程序的根目錄下輸入“lite-server”，或者在“NPM啟動”命令中將其放在NPM命令鏈中。
在我們開始之前，我們需要調整服務器運行的網址和Chrome實例開始的URL。
所以，使用lite-server中的端口替換配置文件中的端口。比如，我的是“3000”。
然後，啟動lite服務器，點擊“play”。
相關推薦
'如何使用chrome瀏覽器進行js調試找出元素綁定的點擊事件'
"大家有沒有遇到這樣的一個問題，我們在分析一些大型電子商務平臺的Web前端腳本時，想找到一個元素綁定的點擊事件，並不是那麼容易，因為有些前端腳本封裝的比較隱蔽，甚至有些加密腳本，用傳統的查找元素ID、或者頁面源碼方法去找，可能最後徒勞無功。下面我來介紹利用chrome瀏覽器...
'Chrome Enterprise 76中使用CRX2封裝格式的自託管套件無法更新'
"Google推出了Chrome Enterprise 76，這個版本的更新重點，除了預設阻止Adobe Flash之外，為了安全性考察，Chrome Enterprise 76將停止使用CRX2格式的企業自託管擴充套件更新。為因應Adobe將在2020年底停止更新Flas...
'使用結構體的好處，c++如何使用 指向結構體的指針？'
"C++結構體的使用1. 為什麼要使用"結構"（結構體）但需要表示一些複雜信息時，使用單純的數據類型很不方便。比如：學生信息（學號，姓名，班級，電話，年齡）2 什麼是"結構"結構，就是程序員自定義的一種"數據類型" 是使用多個基本數據類型、或者其他結構，組合而成的一種新的"...
'VS code 你們都在用嗎？或許你們需要看一下(配置類插件)篇'
"在前端開發中，有一個非常好用的工具，Visual Studio Code，簡稱VS code。 都不用我安利VS code，大家就會乖乖的去用，無數個大言不慚的攻城獅，都被VS code比德芙還絲滑的強大功能所折服。 我是來給大家安利插件的，想做個比較全面的插件集合給大家...
VS code 你們都在用嗎？或許你們需要看一下(基礎)篇
一、關於Vscode1.1 VsCode是個啥Visual Studio Code is a lightweight but powerful sourc...
面試官：不使用synchronized和lock，如何實現一個線程安全的單例
作者：Hollis單例，大家肯定都不陌生，這是Java中很重要的一個設計模式。稍微瞭解一點單例的朋友也都知道實現單例是要考慮併發問題的，一般情況下，我們都會使用synchronized來保證線程安全。那麼，如果有這樣一道面試題：不使用synchronized和lock，如何...
懷舊模擬器整合應用RetroArch安裝和使用介紹「農步祥」
NESPi Case+ 樹莓派機箱外殼NESPi Case+ 樹莓派機箱外殼雖然已經在樹莓派這樣的設備上體驗過復古遊戲主機模擬器Lakka，但即使最新的3...
推薦中...