目錄
-
-
- 1、引言
- 2、配置
-
- 2.1、配置VsCode環境
- 2.2、VsCode安裝插件（Debugger for chrome）
- 2.3、設定Creator的腳本編輯器
- 2.4、VsCode配置設定
- 2.5、效果展示
- 3、結束語
-
1、引言
作為一個程式員，在寫代碼的時候有斷點調試是很友善的！出了問題便于查找，相信每個程式員都是極其友善的！這裡分享一下Cocos creator typescript的斷點調試方法！
2、配置
開始之前請確定您已安裝了cocoscreator ，chrome浏覽器，visual code 這三個軟體！此時打開creator 打開一個示例工程或者自建一個hello world項目。
2.1、配置VsCode環境
這裡可以參考官方配置方法，點此檢視具體配置方法 。
2.2、VsCode安裝插件（Debugger for chrome）
打開vsCode，點選十字回形按鈕，如圖所示，在搜尋框中直接填入Debugger for chrome，然後點選安裝。
2.3、設定Creator的腳本編輯器
在creator 裡面輕按兩下HelloWorld.js 項目目錄會被visual vode打開（creator 編輯器 檔案->設定->資料編輯->外部腳本編輯器需要配置成visual code），這裡的vsCode是你的安裝路徑的Code.exe。
我的目錄如圖所示：
2.4、VsCode配置設定
點選visual code 左邊側邊欄上有個蟲子被圈住的那個按鈕，然後點齒輪按鈕，如圖所示：
這時候右邊會出現幾個選項，選擇chrome，此時會生成一個launch.json檔案，如圖所示：
這時，進入creator 編輯器完成配置操作 開發者->VS code 工作流->添加 Chrome Debug 配置 ，上面的launch.json檔案内容會被修改為下面的樣子：
2.5、效果展示
到這裡我們已經配置完成了！此時保持creator 編輯器打開，在visual code 裡面 下個斷點，按下F5運作項目，這樣啟動界面就卡住進入斷點了(修改了代碼運作之前記得先編譯)。
3、結束語
The End
好了，今天的分享就到這裡，如有不足之處，還望大家及時指正，随時歡迎探讨交流！！！
喜歡的朋友們，請幫頂、點贊、評論！您的肯定是我寫作的不竭動力！