Sourcemaps на одну строку в Chrome с Ruby on Rails, Webpack и React JS

96

У меня проблема, когда исходные карты, созданные Webpack с использованием параметра inline-source-mapконфигурации, отключаются на одну строку, когда я использую отладчик Chrome devtools. Webpack настраивается внутри приложения Ruby on Rails для создания конкатенированного неминифицированного файла JavaScript, состоящего из пары десятков модулей. Большинство этих модулей являются компонентами ReactJS и анализируются jsxзагрузчиком. Затем вывод Webpack включается в application.jsфайл вместе с некоторыми другими библиотеками JavaScript, созданными гемами.

Когда пользуюсь eval-source-map, проблем нет. Что-то в использовании inline-source-mapзаставляет номера строк сбрасываться на один.

Проверка JavaScript, который не является компонентом React, по-прежнему вызывает эту проблему, поэтому я не думаю, что это связано с использованием jsx.

javascript ruby-on-rails google-chrome webpack source-maps Paradasia
источник
4
Звучит так, как будто одна сторона считает первую линию линией, 0а другая - линией 1. Возможно, вам просто нужно выбрать одно определение и отрегулировать значение для всего, что работает наоборот.
Carl Smith
3
Если есть способ настроить значение, которое браузер использует для номеров строк в исходных картах, это потенциально может решить проблему. Также с тех пор я немного поэкспериментировал, и кажется, что при использовании Rails без Sprockets, обрабатывающего JS, сгенерированный webpack, проблема исчезает. Номер строки отключен только при использовании веб-пакета и звездочек.
paradasia 08
1
Понятия не имею. Я использовал исходные карты CoffeeScript с JS-библиотекой исходных текстов Mozilla. Все было прекрасно , за исключением того, что columnаргумент в следующем коде передается в 1 слишком высока: window.onerror = function(message, url, line, column){}. Уменьшение его исправления. Примечание. Это относится к Chrome, о других браузерах я не знаю.
Карл Смит
2
Кажется, это связано: github.com/plumberjs/plumber-requirejs/commit/… в том, что это устранило проблему для require.js
Justingordon
1
Может быть, вы добавляете строку заголовка где-нибудь в процессе, например, заявление об авторских правах?
rogierschouten

Ответы:

3

В chrome произошла ошибка, попробуйте последнюю версию, также в конфигурации вашего веб-пакета попробуйте использовать разные исходные карты в devtool, попробуйте все это, чтобы увидеть, работает ли один из встроенных исходных карт:

  • встроенная исходная карта

  • дешевая инлайн карта источников

для других разных конфигов:

  • дешевая карта источников

  • дешевый модуль-источник-карта

  • дешевый модуль-оценка-исходная карта

в конфигурации webpack:

{

...

devtool:'source-map'

...

}
Агаменнон
источник