如何將JS源代碼映射添加到Chrome devtools？

Question

我部署的JavaScript應用程序引發了異常。 Javascript代碼被混淆了。 我想知道，原始源代碼中的哪一行引發了異常。 未部署源地圖，因此Chrome Devtools無法連接它們。 我可能在我的localhost上有源映射。

所以基本上我想從我的機器添加源映射到瀏覽器，以便知道出現異常的行號。

我嘗試Add Folder to Workspace並Map to File System Resource 。 它沒有幫助。 在瀏覽器的控制台中可以看到異常，但它仍然指向混淆的javascript源，並且無法檢測到所需的行號。

我可能做錯了什么。 任何幫助表示贊賞（包括額外的擴展或其他瀏覽器使用）。

Answer 1

與Workspaces一樣強大，您應該注意一些限制。

限制

• 僅保留“元素”面板中的樣式更改; 對DOM的更改不會保留。
• 只能保存外部CSS文件中定義的樣式。 對element.style或內聯樣式的更改不會保留。 （如果您有內聯樣式，可以在“源”面板上更改它們。）
• 如果您將CSS資源映射到本地文件，則“元素”面板中的樣式更改會立即保留，而不會顯式保存 - Ctrl + S或Cmd + S（Mac）。
• 如果要從遠程服務器而不是本地服務器映射文件，則在刷新頁面時，Chrome會從遠程服務器重新加載頁面。 您的更改仍會保留在磁盤上，如果您繼續在工作區中進行編輯，則會重新應用這些更改。
• 您必須使用瀏覽器中映射文件的完整路徑。 即使您的索引文件必須在URL中包含.html，以便查看暫存版本。

https://developers.google.com/web/tools/setup/setup-workflow