如何在chrome開發工具中調試ion3 typescript代碼

如果您正在使用Visual Studio代碼,您可以安裝Cordova Tools擴展,這將允許您在設備上進行調試,它是VSCode非常強大的工具,也是我發現開發Ionic 3和Angular的最佳編輯器/ IDE 4個應用程序

程序很直接:

從.vscode目錄中刪除現有的launch.json文件,然后轉到Debugger并點擊小齒輪圖標。

選擇Cordova作為調試器。

擴展將為您實際創建12個配置,我們需要第一個“在設備上運行Android”

現在,這就是我所做的(Mac OS X Sierra),具體取決于系統中安裝的組件和組件,這可能會改變。我打開Android Studio,然后連接我的連接到我的Android測試設備的usb電纜。

一旦我看到我的設備列在Android監視器面板中,并且在Logcat選項卡中運行的調試進程,我切換到我的VSCode窗口并在終端中發出:ion cordova android運行,然后等待應用程序在手機上啟動。

應用程序在設備中顯示后,單擊VSCode中的調試按鈕,調試器應該附加。

現在您的調試器應該觸發您的斷點,并讓您調試您的類型腳本代碼與應用程序運行在測試設備上。

我想你也可以直接從Chrome開發人員工具進行調試,但是可能需要為tsconfig.json中的源地圖文件的位置配置一些其他選項。我相當推薦你vscode,因為它有很多有用的功能,它是免費的,還有從Ionic 3片段,自動完成和CLI命令從UI的擴展。

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 173,432評論 25 708
  • 這是我寫的一系列文章中的第一篇關于如何利用Web開發技術為iOS和Android系統構建混合應用程序(Hybrid...
    bubuli閱讀 2,663評論 3 29
  • Spring Cloud為開發人員提供了快速構建分布式系統中一些常見模式的工具(例如配置管理,服務發現,斷路器,智...
    卡卡羅2017閱讀 134,969評論 19 139
  • 曾是桃云看處, 曉岸芳菲如舞。 幾度翠凋零, 此去湘情何處? 追溯,追溯! 往事如煙似霧。
    陌蝶詩語閱讀 375評論 4 2
  • 這個時代變化太快,快得連我們自己的不認識自己了 。 這幾天,累得鳥都飛不起來,突然休息了一下,感覺全身沒有力氣,就...
    逆行一生閱讀 230評論 0 0