DevToolsはSourceMapの解析に失敗しました
Webpackプロジェクトでソースマップファイルを取得しようとしています。
私は最終的にそれを行うように設定を正しくしましたが、今ではこのエラーが発生しています：
DevToolsはSourceMapの解析に失敗しました： http：//MyServer/MyApp/bundle.js.map
記載されているURLにアクセスすると、次のプロパティを持つjsonファイルが見つかります。
- version-3に設定
- sources-ファイルへのwebpackパスのように見える非常に長い文字列の配列。
- names-ランダム変数および関数のように見える文字列の非常に長い配列。
- mappings-一見ランダムに見える大文字とコンマの非常に長い文字列。
- file-bundle.jsに設定
- sourcesContent-非常に長い文字列の配列（1000万文字以上）。すべてのソースコード。
- sourceRoot-空の文字列に設定
すべて有効なjsonのようです。残念ながらChromeは、ソースマップの解析に失敗した理由を示しません。
Chromeソースマップの解析に失敗した理由を示す方法はありますか？
または、それが失敗した場合、私のソースマップが失敗する理由を誰か知っていますか？（私のコードは投稿するには大きすぎますが、ここに私の webpack .config.js およびmy package.json files。）
ノート：
- これをwebpack 2.2.1、webpack 2.3.2およびwebpack 2.6.1で試しました。
- ソースマップは、IE 11およびFirefoxで正常に機能します。
- ソースマップをインライン化すると、Chrome DevToolsで正常に動作しますが、bundle.jsは3 MB（既に大きすぎます）から16 MB（大きすぎます）になります。
- 設定で「JavaScriptソースマップを有効にする」を設定しました（CSSも設定しました）。
- Chrome Canaryを使用してみましたが、同じ問題がありました。
- IISでホストしています。
経験から、クライアントがSourceMapを解析できなかった理由を説明することは期待していません（ただし、それは素晴らしいことです）。いくつかのツールが大きなソースマップ（おそらくメモリの制約）を解析できないという問題に遭遇しました。そして、あなたの大きなアセットサイズを考えると、最初にそれを見ます。
Webpackはdevtool configフィールドに対していくつかの異なる値をサポートしますが、それらのいくつかはデフォルトよりも忠実ではありません。たとえば、'cheap-module-source-map'？行番号のみ（列なし）を取得することは、使用可能なソースマップIMOとのトレードオフです。
しかし、おそらくアセットサイズを小さくする方が役立つでしょう。 Webpackの コード分割 および「チャンク」管理オプションにより、コードを実行時に非同期でロードされる複数のファイルに分割するのは非常に簡単です。この場合、2つ以上のJSファイルがあり、それぞれに独自のソースマップがあるため、ブラウザーは1つの大きなファイルを処理しようとすることを止めません。