11

angular-generator を使用してヨーマンアプリを構築しています。

私の index.html ファイルに含まれる js ライブラリは次のとおりです。

<script src="bower_components/jquery/dist/jquery.js"></script>
<script src="bower_components/modernizr/modernizr.js"></script>
<script src="bower_components/angular/angular.js"></script>   
<script src="bower_components/angular-ui-router/release/angular-ui-router.js"></script>
<script src="bower_components/d3/d3.js"></script>
<script src="bower_components/select2/select2.js"></script>
<script src="bower_components/angular-ui-select2/src/select2.js"></script>

この問題は、jquery がangular の前に含まれている場合にのみ発生し、その後にある場合は発生しません。

タイトルにある問題は、コンソールに「警告: angular を複数回読み込もうとしました」というメッセージが表示され、アプリを初期化できないことです。

なぜこれが起こるのか、誰にも手がかりがありますか?

私は単一の ng-app を持っています。角度を一度だけ含めています...そしてすべて。スクリプトの位置を変更すると直るので、構成に関係するものではないようです。

手がかりはありますか？

スクリプトの順序を含めるように構成できるかどうかは誰にもわかりませんか? angular-generator を使用しているので、bower スクリプトを含めるために usemin でこれを設定しました。スクリプトをどの順序で含めるかを指定できる方法はあるのだろうか。

これは、私のプロジェクトの bower.json ファイルです。

{
  "name": "<name>",
  "version": "0.0.0",
  "dependencies": {
    "angular": "1.2.15",
    "json3": "~3.2.6",
    "es5-shim": "~2.1.0",
    "angular-ui-router": "~0.2.10",
    "modernizr": "~2.8.1",
    "d3": "~3.4.6",
    "angular-ui-select2": "~0.0.5"
  },
  "devDependencies": {
    "angular-mocks": "1.2.15",
    "angular-scenario": "1.2.15"
  }
}

グーグルで検索しようとしましたが、うまくいきませんでした。前もって感謝します！

更新 1:

この方法でスクリプトをインクルードすると、angular が 2 回インクルードされることはなく、常に最初にロードされることがわかりました。

  <!-- build:js scripts/vendor.js -->
  <script src="bower_components/angular/angular.js"></script>
  <!-- bower:js -->
  <script src="bower_components/jquery/dist/jquery.js"></script>
  <script src="bower_components/modernizr/modernizr.js"></script>
  <script src="bower_components/angular-ui-router/release/angular-ui-router.js"></script>
  <script src="bower_components/d3/d3.js"></script>
  <script src="bower_components/select2/select2.js"></script>
  <script src="bower_components/angular-ui-select2/src/select2.js"></script>
  <!-- endbower -->

最善の解決策ではありませんが、少なくとも今のところ... とにかく、bower:js タグ内にすべてを入れたいと思います。

4

8 に答える 8

2

同じ警告が表示されましたが、これは含まれているファイルの順序と使用されているバージョンが原因でした。

上記の警告を解決するために、次の順序でファイルを再インクルードしました。

jquery.js
jqueryui.js
angular.js

注: angularjs を に置き換えることができるように、jquery前に script タグを追加する必要があります。angularjsjqLitejQuery

さらに、私のコードは で動作してAngularJS v1.2.0いましたが、より高い角度のバージョンでは動作していませんでした。したがって、jquery と angularjs のバージョンの互換性も確認してください。

于 2014-10-05T15:50:18.450 に答える
0

はい、HTML ページで JS スクリプトの順序を並べ替えることで問題を解決しました。

angular js スクリプトを最初の順序で配置すると、これは発生しなくなります。

それは非常に奇妙です。

ありがとう。

于 2015-07-21T11:03:00.153 に答える
0

electron アプリを使用しているときに、同様の問題に直面していました。index.html ページに angular.min.js を含めていましたが、そのページにアクセスするたびに、警告が表示される回数が 1、2、4、8、16 などのように 2 倍になりました。そのため、4/5 の更新後、アプリは非常に遅くなっていました。私が見つけた解決策は.. script タグで angular.min.js を含める代わりに、require('./path/angular.min.js'); を使用します。

これにより、ファイルが一度だけロードされます。

ノードのドキュメントによると

キャッシング #

モジュールは、最初にロードされた後にキャッシュされます。これは、require('foo') を呼び出すたびに、同じファイルに解決される場合、まったく同じオブジェクトが返されることを (とりわけ) 意味します。

require('foo') を複数回呼び出しても、モジュール コードが複数回実行されることはありません。これは重要な機能です。これにより、「部分的に完了した」オブジェクトを返すことができるため、サイクルが発生する場合でも推移的な依存関係をロードできます。

于 2017-03-25T07:52:50.150 に答える
-7

tools visual studio ---- angularjsファイルに次のようにコメントするだけです`

    <script src="~/Scripts/angular.min.js"></script>


</section>`
于 2015-05-14T05:35:31.783 に答える