2017-07-29 75 views
0

我是angular2和typescript的新手,並且使用angular CLI生成了一個簡單的應用程序。在我繼續之前,我必須說,我瞭解在VS Code中看到打字稿代碼和在瀏覽器中運行的應用程序之間會發生什麼差距。VS代碼中的打字稿,測試和調試

在之前的編輯器中,我習慣於看到生成的.js文件,並將運行中的應用程序視爲具有生成文件的網頁。但是當運行ng serve時,任何地方都沒有.js文件,應用程序仍然在瀏覽器中運行。我想知道的第一件事是如何發生 - 我認爲打字稿不可被瀏覽器閱讀。

其次,我在使用VS代碼調試Karma測試運行器中的單元測試時遇到了問題。我能夠調試應用程序本身,我可以將調試器附加到Karma實例,但是當我在測試中放置斷點時,出現錯誤breakpoint ignored because generated code not found (source map problem?)。作爲參考,這是我的launch.json

{ 
     "type": "chrome", 
     "request": "attach", 
     "name": "Attach Karma Chrome", 
     "address": "127.0.0.1", 
     "port": 9333, 
     "sourceMaps": true, 
     "webRoot": "${workspaceRoot}" 
    } 

和我karma.conf.js包含

browsers: ['ChromeDebugging'], 
customLaunchers : { 
    ChromeDebugging: { 
    base: 'Chrome', 
    flags: ['--remote-debugging-port=9333'] 
    } 
}, 

編輯:這是一個完整karma.conf.js

+0

您的配置對我而言效果很好。你能提供完整的'karma.conf.js'內容嗎? –

回答

0

試試這個

{ 
     "type": "chrome", 
     "request": "attach", 
     "name": "Attach Karma Chrome", 
     "address": "127.0.0.1", 
     "port": 9333, 
     "sourceMaps": true, 
     "webRoot": "${workspaceRoot}/test" 
    } 
0

我已經決定調試在瀏覽器中使用進行測試存儲庫