6

私は Angular と RequireJS を使用しています。RequireJS 最適化を使用しようとしましたが、アプリケーションが機能しなくなりました。縮小のせいだと思います。

Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.2.0rc1/$injector/modulerr?p0=myapp&p1=Error%3…t%20(http%3A%2F%2Flocalhost%3A8080%2Fwebapp%2Fapp%2Fmain-built.js%3A4%3A10)

エラー メッセージは問題を見つけるのにあまり役に立たないので、ソース マップを使用して元のソース コードのエラーを特定する方法を考えていました。Chrome を使用してデバッグします。

編集：完全なエラースタックトレース

Failed to instantiate module myapp due to:
Error: [$injector:unpr] http://errors.angularjs.org/1.2.0rc1/$injector/unpr?p0=e
    at Error (<anonymous>)
    at http://localhost:8080/webapp/app/main-built.js:3:19581
    at http://localhost:8080/webapp/app/main-built.js:3:31899
    at n (http://localhost:8080/webapp/app/main-built.js:3:30540)
    at Object.r [as invoke] (http://localhost:8080/webapp/app/main-built.js:3:30716)
    at http://localhost:8080/webapp/app/main-built.js:3:30147
    at Array.forEach (native)
    at o (http://localhost:8080/webapp/app/main-built.js:3:19891)
    at i (http://localhost:8080/webapp/app/main-built.js:3:29951)
    at yt (http://localhost:8080/webapp/app/main-built.js:4:10
4

1 に答える 1

7

これを機能させるための手順は次のとおりです。

  1. Chrome の開発者ツールで、設定アイコン (右下隅) をクリックします。
  2. 設定ダイアログで、「ソースマップを有効にする」にチェックを入れます。
  3. デバッグする Web ページを開きます。
  4. 開発者ツールを開きます (この新しいタブで)
  5. ページをリロードする
    • これは重要です。そうしないと、Chrome はマップ ファイルをダウンロードしません。
  6. 調べたいエラーリンクを押してください
    • エラーの右側にありますmain.js:12。
  7. それでおしまい。これで、人間が判読できる、縮小されていないバージョンのスクリプトにリダイレクトされるはずです。

ソース マップがまだ機能しない場合:

  1. 縮小された JS ファイルの一番下に、次のようなものが含まれていることを確認します。

    //# sourceMappingURL=main.js.map

  2. マッピング ファイルがダウンロードされていることを確認します。ページのリロード中にダウンロードされたものとして、開発者ツールの「ネットワーク」セクションにリストされている必要があります。次のようになります。

    ソース マップ ファイルのダウンロード ステータス

  3. たぶん、RequireJS の縮小sourceMappingURLにより、出力 JS ファイルからコメントが取り除かれるのではないでしょうか?

    uglify2メソッドを使用していて、オプションが有効になっていることを確認してくださいgenerateSourceMaps。requirejsGruntのターゲット構成の関連部分は次のとおりです。

requirejs: {
  compile: {
    options: {
      /* some other options here */
      optimize: 'uglify2',
      logLevel: 0,
      preserveLicenseComments: false,
      generateSourceMaps: true
    }
  }
}
于 2013-09-04T10:34:08.910 に答える