Visual Studio使用源映射進行調試

Question

我正在使用Microsoft Visual Studio 2013 Update 4來調試Web應用程序。首先，我在Internet Explorer上運行Web應用程序，然後使用Visual Studio中的「附加到進程」調試選項來附加iexplore腳本進程。然後，我立即在解決方案資源管理器中獲得一個名爲「Script Documents」的新節點。在該節點中，我找到了所有的JavaScript文件以及列出的各自的打印文件。從此，我可以打開JavaScript文件並設置斷點。不幸的是，我無法爲打字稿文件做同樣的事情。試圖打開它時，出現'404未找到'錯誤。仔細觀察後，我發現用於檢索它們的URL路徑是錯誤的。因此，我開始檢查源文件的路徑是否在編譯打字稿文件時生成的源地圖中正確設置。它看起來像是正確設置的。我檢查源地圖是否正確的一種方法是使用開發工具在Internet Explorer和Chrome上進行調試。他們的工作完美無瑕。因此，我唯一可以得出的結論是，當Visual Studio連接到IE時，源映射解釋發生了一些情況。

爲了正確闡明這一點，讓我簡單地解釋我的源地圖是怎樣的。下面你會發現我的源地圖文件的模板。

{ 
version : 3, 
file : "someFile.js", 
sourceRoot : "/", 
sources : ["some/relative/path/someFile.ts"], 
names : ["bla", "bla", "bla"], 
mappings: "aaaG,agAA,agGG,acAA" 
} 

所以，我期待看到在腳本文件節點是打字稿文件的路徑（如果我們假設web應用程序是在本地主機上運行）：http://localhost:8081/some/relative/path/someFile.ts

而是我看到的路徑是：http://localhost:8081/(AbsolutePathToWhereTheJSFileIs)/some/relative/path/someFile.ts

這終於明白我爲什麼在閱讀文件時出錯。我不明白爲什麼在它們之間插入絕對路徑，而在我的源地圖規範中沒有指示。我嘗試了很多其他路徑變體，但保持腳本的目錄的絕對路徑總是在中間彈出。我甚至在尋找可能會關閉它的設置（如果有的話），但我無法找到任何設置。對於我面臨的這個問題，我將不勝感激。

乾杯！

Answer 1

我已經找到問題所在。在我的組織中處理節點服務器的代碼正在做一些我沒有注意到的事情。但是在創建簡單的示例測試以在此共享時，我能夠這樣做。因此，在Visual Studio &調試中附加iexplore腳本進程無需麻煩。

Answer 2

這是你的真實.map文件？

{ 
version : 3, 
file : "someFile.js", 
sourceRoot : "/", 
sources : ["some/relative/path/someFile.ts"], 
names : ["bla", "bla", "bla"], 
mappings: "aaaG,agAA,agGG,acAA" 
} 

或者你得到

{ 
version : 3, 
file : "someFile.js", 
sourceRoot : "/", 
sources : ["(AbsolutePathToWhereTheJSFileIs)some/relative/path/someFile.ts"], 
names : ["bla", "bla", "bla"], 
mappings: "aaaG,agAA,agGG,acAA" 
} 

在任何情況下，你正在尋找一起玩的選項是編譯器標誌sourceRoot這是AbsolutePathToWhereTheJSFileIs配置選項。