Могу ли я включить исходные карты в расширении Chrome?

#javascript #google-chrome #google-chrome-extension #sentry #source-maps

Вопрос:

Я занимаюсь разработкой тестов и созданием расширения Chrome с использованием Svelte и ParcelJS и хотел бы увидеть исходные карты в chrome dev tools. Однако, просматривая любую страницу, я вижу только связанный код, вижу эту ошибку:

DevTools не удалось загрузить исходную карту: не удалось загрузить содержимое для chrome-расширение://debafkiakedogoflaalmbbfbbccnfbib/Background/index.js.map: Ошибка HTTP: код состояния 404, net::ERR_UNKNOWN_URL_SCHEME

Кажется, загрузчику не нравится схема chrome-extension URL. Я попытался добавить ‘dist’ в качестве переопределяемого каталога, но все, что загружает исходные карты, похоже, игнорирует его и по-прежнему использует схему ‘chrome-extension`.

Я могу заставить его работать, вручную изменив URL-адрес на другую схему, либо file:/// URL-адрес, либо запустив простой http-сервер в каталоге dist и используя http:// URL-адрес:

 //# sourceMappingURL=file:///c:/git/svelte-extension/dist//Background/index.js.map`
//# sourceMappingURL=http://localhost:8080/Background/index.js.map`

Есть ли способ заставить chrome переопределить каталог или указать parcel создать эти URL-адреса?

1. FWIW я использую data:application/json URL-адреса в webpack, и исходные URL-адреса отображаются как webpack://....

2. Parcel, похоже, не поддерживает встроенные исходные карты, но webpack поддерживает. Они должны вообще пропустить этот вопрос.

3. Примечание о встраивании исходных карт в расширения: это решило мою проблему с тем, что Chrome не мог загружать внешние карты, но мои пакеты стали намного больше. Мне пришлось переключиться обратно на внешние, когда один из моих пакетов js стал больше 4 МБ, что запрещено аддонами Mozilla на основании того, что их автоматическая проверка кода не может его обработать.

Ответ №1:

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

Фон

Chrome всегда автоматически не загружал файлы исходных карт из схемы chrome-extension:// URL. Chrome v80 начал сообщать об DevTools failed to load SourceMap ошибке.

Это может скоро измениться, так как в работе есть исправление. Некоторые проблемы безопасности сдерживают это, поэтому держите пальцы скрещенными.

Вот две соответствующие ошибки Chromium, отслеживающие это:

1. У меня была аналогичная проблема при работе с webpack. Я хотел просмотреть свой исходный код для отладки, но не смог, потому что Chrome не мог прочитать исходную карту. Переход от devtool: "source-map" к devtool: "inline-source-map" разрешил проблему для меня.