警告:尝试多次加载角度.当我包含 JQuery [英] WARNING: Tried to load angular more than once. when I include JQuery

问题描述

我正在构建一个带有角度生成器的自耕农应用程序.

I am building an yeoman app with an angular-generator.

我的 index.html 文件中包含的 js 库是:

The js libraries included in my index.html file are:

<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 包含在 before angular 时发生，如果在它之后则不会发生.

The problem only occurs if jquery is included before angular and it does not happen if it is after it.

标题所述的问题是我在控制台中收到警告:尝试多次加载 angular" 并且应用程序无法初始化.

The problem as the title states is that I get "WARNING: Tried to load angular more than once" in the console and the app cannot initialize.

有人知道为什么会发生这种情况吗?

Does anyone have any clues why this can happen?

我有一个 ng-app，我只包含了一次 angular ......以及所有内容.它看起来不像是与配置有关的东西，因为更改脚本的位置可以修复它.

I have a single ng-app, I am including angular just once... and everything. It does not look like it is something related to the configuration because changing the position of the script fixes it.

你们有什么线索吗?

有谁知道我是否能够配置以包含脚本的顺序?当我使用 angular-generator 时，我已经使用 usemin 进行了设置以包含 bower 脚本.我想知道是否有任何方法可以指定包含脚本的顺序.

Does anyone know if I am able to configure to include order of the scripts? As I am using angular-generator I have set this up with usemin to include the bower scripts. I wonder if there is any way to be able to specify in which order to include the scripts.

这是我的项目的 bower.json 文件:

This is the bower.json file for my project:

{
  "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"
  }
}

我尝试在谷歌中搜索但没有运气.提前致谢！

I have tried to search in google with no luck. Thanks in advance!

更新 1:

我刚刚发现，如果我以这种方式包含脚本，则 angular 将不会被包含两次，并且总是首先加载.

I just found out that if I include the scripts this way, angular won't be included twice and it is always loaded first.

  <!-- 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 标签中包含所有内容.

Not the best solution but at least for now... Anyways, I would like to have everything inside bower:js tags.

推荐答案

经过长时间的测试...最终我的 index.html 文件中出现了一个

After long hours of testing... it ended up being that on my index.html file I had a

<ui-view />

被 angular ui 路由器使用并将其替换为这个，成功了.

to be used by angular ui router and replacing it to this, did the trick.

<ui-view></ui-view>

这篇关于警告:尝试多次加载角度.当我包含 JQuery的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！