如何在 AngularJS 项目中包含 ui.router？答案

【问题标题】：How to include ui.router in AngularJS project?如何在 AngularJS 项目中包含 ui.router？
【发布时间】：2014-08-14 00:52:30
【问题描述】：

我不断收到此错误：

`错误：[$injector:nomod] 模块“ui.router”不可用！您要么拼错了模块名称，要么忘记加载它。

但我很确定我已经正确配置了所有内容

该项目是使用 Yeoman 创建的，使用 Bower 管理依赖项，使用 Grunt 构建所有内容。

yeoman 角度生成器使用基本的 ngRouter 创建了样板，所以我安装了 ui.router

bower install angular-ui-router --save

角度版本

1.2.16

鲍尔文件

以上行在依赖项列表中用这一行更新了 bower.json 文件：

"angular-ui-router": "~0.2.10"

应用模块设置

我通过添加对 ui.route 的依赖项更新了 app.js 文件（除了各种其他依赖项） angular.module('app', ['ngRoute', ... 'ui.router'])

index.html

<!-- build:js(.) scripts/vendor.js -->
<!-- bower:js -->
...
<script src="bower_components/angular-ui-router/release/angular-ui-router.js"></script>
<!-- endbower -->
<!-- endbuild -->

我在上面的目录中有上面的文件，我很肯定它在那里（我复制并粘贴了路径以避免拼写错误）。我也尝试了缩小版，没有任何区别。

编辑

我对这一切（角度、鲍尔、约曼等）非常、非常陌生，所以我很可能做错了，难道我不再需要包括 ui.router 依赖项？我的意思是，它是否以某种方式集成到 core 角度框架中？ ui.router 被弃用了吗？

【问题讨论】：

我会假设您的包含顺序已关闭。也许你的 ui-router 脚本标签是在你包含了你的 angular.module 调用的脚本之后出现的。 angular-ui.github.io/ui-router/site/#/api/ui.router 提供了一个最小的设置示例
不，我在我的主要 app.js 之前添加了 ui-router 引用（其中包含 anugular.module 内容）
angular-ui-router.js 是否加载正确？开发工具中的任何内容？
应该是。为了确保，我尝试直接从以下 URL 加载脚本，但仍然收到相同的错误：<script src="http://angular-ui.github.io/ui-router/release/angular-ui-router.js"></script>

标签： angularjs yeoman angular-ui-router bower

【解决方案1】：

通过此链接，您将获得使用 ui 路由器使用 angular.js 的完整结构

Github Repository

【讨论】：

【解决方案2】：

我很笨。从this link 找到答案。在 cmd 行上运行 grunt 时，它不仅被配置为构建和检查错误，而且还运行测试（使用我还不了解的业力）。

所以需要改变的是业力配置文件：

<project root>/test/karma.conf.js

下面，缩进的行是我需要添加的：

// list of files / patterns to load in the browser
    files: [
      'bower_components/angular/angular.js',
      'bower_components/angular-mocks/angular-mocks.js',
      'bower_components/angular-animate/angular-animate.js',
      'bower_components/angular-cookies/angular-cookies.js',
      'bower_components/angular-resource/angular-resource.js',
      'bower_components/angular-route/angular-route.js',
      'bower_components/angular-sanitize/angular-sanitize.js',
      'bower_components/angular-touch/angular-touch.js',
         'bower_components/angular-ui-router/release/angular-ui-router.js',
      'app/scripts/**/*.js',
      'test/mock/**/*.js',
      'test/spec/**/*.js'
    ],

【讨论】：