Ruby on Rails、Webpack、React JSを使用してChromeでソースマップを1行オフ


96

inline-source-mapChrome devtoolsデバッガーを使用すると、構成設定を使用してWebpackによって生成されたソースマップが1行ずれるという問題があります。Ruby on Railsアプリケーション内にWebpackがセットアップされ、数十のモジュールで構成される連結された非縮小JavaScriptファイルが生成されます。これらのモジュールのほとんどはReactJSコンポーネントであり、jsxローダーによって解析されます。Webpackからの出力は、application.jsgemsによって生成された他のJavaScriptライブラリとともにファイルに含まれます。

使用してeval-source-mapも問題ありません。の使用に関する何かがinline-source-map原因で、行番号が1つ破棄されます。

ReactコンポーネントではないJavaScriptの検査でもこの問題があるため、jsxの使用に関連しているとは思いません。


4
一方が最初の行を行0と見なし、もう一方が行と見なすように聞こえ1ます。1つの定義を選択し、逆に機能するすべての値を調整する必要がある場合があります。
カールスミス

3
ブラウザがソースマップの行番号に使用する値を調整する方法がある場合は、問題を解決できる可能性があります。また、それ以来、少し実験を行ったところ、Webpackによって生成されたJSをSprocketsで処理せずにRailsを使用すると、問題は解消したようです。ライン番号は、webpackとsprocketsの両方を使用する場合にのみオフになります。
パラダシア2014年

1
わからない 私はCoffeeScriptのソースマップとMozillaのソースマップJSライブラリを使用していました。column次のコードの引数が高すぎる1で渡されることを除いて、すべてが問題ありませんwindow.onerror = function(message, url, line, column){}でした。それをデクリメントして修正しました。注:これはChrome固有のものであり、他のブラウザについては知りません。
カールスミス

2
これは関連しているようです:github.com/plumberjs/plumber-requirejs/commit/…これによりrequire.jsの問題が修正されました
justingordon

1
あなたはプロセスのどこかにヘッダー行を追加するかもしれません、例えば著作権声明?
rogierschouten

回答:


3

Chromeにバグがありました。最新バージョンを試してください。また、webpackの設定で、devtoolでさまざまなソースマップを使用してみて、これらすべてを試して、インラインソースマップで機能するかどうかを確認してください。

  • inline-source-map

  • 安いインラインソースマップ

他の異なる構成の場合:

  • 安いソースマップ

  • 格安モジュールソースマップ

  • 格安モジュール評価ソースソースマップ

Webpack構成:

{

...

devtool:'source-map'

...

}
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.