Как добавить исходную карту JS в Chrome devtools?

Question

У меня развернутое приложение JavaScript вызывает исключение. Код Javascript запутан. Я хотел бы знать, какая строка в исходном исходном коде создает исключение. Исходные карты не развернуты, поэтому Chrome Devtools не может их подключить. У меня могут быть исходные карты на моем локальном хосте.

Поэтому я хотел бы добавить исходные карты с моей машины в браузер, чтобы узнать номер строки, где происходят исключения.

Я пробовал Add Folder to Workspace и Map to File System Resource. Это не помогает. Исключение отображается в консоли браузера, но оно все еще указывает на запущенный источник javascript, а нужный номер строки не поддается обнаружению.

Я могу сделать что-то не так. Любая помощь приветствуется (включая дополнительное расширение или использование другого браузера).

Answer 1

Такие мощные, как Рабочие пространства, есть некоторые ограничения, о которых вы должны знать.

Ограничения

• только изменения стиля в панели элементов, сохраняются; изменения в DOM не сохраняются.
• Только стили, определенные во внешнем файле CSS, могут быть сохранены. Изменения в стилях element.style или inline не сохраняются. (Если у вас встроенные стили, их можно изменить на панели «Источники».)
• Изменения стиля на панели «Элементы» сохраняются сразу без явного сохранения - Ctrl + S или Cmd + S (Mac) - если у вас есть ресурс CSS сопоставлен с локальным файлом.
• Если вы переписываете файлы с удаленного сервера вместо локального сервера, при обновлении страницы Chrome перезагружает страницу с удаленного сервера. Ваши изменения по-прежнему сохраняются на диске и повторно применяются, если вы продолжаете редактирование в Workspaces.
• Вы должны использовать полный путь к сопоставленному файлу в браузере. Даже ваши индексные файлы должны содержать .html в URL-адресе, чтобы просмотреть поэтапную версию.

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