单元测试 AngularJS：未捕获的错误：[$injector:nomod] 模块不可用！和 ReferenceError: 运行 Karma 时未定义模块答案

【问题标题】：Unit-Testing AngularJS: Uncaught Error: [$injector:nomod] Module is not available! and ReferenceError: module is not defined when run Karma单元测试 AngularJS：未捕获的错误：[$injector:nomod] 模块不可用！和 ReferenceError: 运行 Karma 时未定义模块
【发布时间】：2015-03-05 04:13:45
【问题描述】：

我在 Jasmine 中使用 Karma 运行了一个小型单元测试。但是当我运行 Karma 时，它会显示错误：

未捕获的错误：[$injector:nomod] 模块“material.controllers”不是可用的！您要么拼错了模块名称，要么忘记加载它。如果注册模块，请确保将依赖项指定为第二个参数。

FAILED Unit: LoginController 遇到了一个声明异常

ReferenceError: 模块未定义

这是我的源代码、配置 Karma 文件和 unitTest。

karma.conf.js

module.exports = function(config) {
  config.set({

    // base path that will be used to resolve all patterns (eg. files, exclude)
    basePath: '',


    // frameworks to use
    // available frameworks: https://npmjs.org/browse/keyword/karma-adapter
    frameworks: ['jasmine'],


    // list of files / patterns to load in the browser
    files: [
      '/home/tanpham/Angular/Dev/libs/angular/angular.js',
      '/home/tanpham/Angular/Dev/js/**/*.js',
      '/home/tanpham/Angular/Dev/js/*.js',
      '/home/tanpham/Angular/Test/*.js'
    ],


    // list of files to exclude
    exclude: [
    ],


    // preprocess matching files before serving them to the browser
    // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
    preprocessors: {
    },

index.html

<body ng-app="material" ng-controller="AppController">
    <ui-view></ui-view>
</body>

app.js

angular.module('material.controllers', []);
angular.module('material.services', []);
angular.module('material.directives',[]);
angular.module('material.filters',[]);
var app = angular.module('material', ['ui.router','material.directives','http-auth-interceptor','material.controllers','material.services','material.filters'])
.config(function($stateProvider, $urlRouterProvider,$locationProvider) {
    $stateProvider
    .state('app', {
        url: "/app",
        abstract: true,
        templateUrl: "views/app.html"
    }).state('login', {
        url: "/login",
        templateUrl: "views/login.html",
        controller: "LoginController"
    });
    
    $urlRouterProvider.otherwise('/login');
})

登录控制器

angular.module('material.controllers').controller('LoginController', function($scope) {
    
      $scope.name = "Ari";
      $scope.sayHello = function() {
         $scope.greeting = "Hello " + $scope.name;
      }
});

helloSpec.js

describe('Unit: LoginController', function() {
    
      // Load the module with LoginController
      beforeEach(module('material.controllers'));

      var ctrl, scope;
      // inject the $controller and $rootScope services
      // in the beforeEach block
      beforeEach(inject(function($controller, $rootScope) {
        // Create a new scope that's a child of the $rootScope
        scope = $rootScope.$new();
        // Create the controller
        ctrl = $controller('LoginController', {
          $scope: scope
        });
      }));
    
      it('should create $scope.greeting when calling sayHello', 
        function() {
          expect(scope.greeting).toBeUndefined();
          scope.sayHello();
          expect(scope.greeting).toEqual("Hello Ari");
      });
    
})

那么，我可以这样做并且我的模块名称是正确的？

【问题讨论】：

标签： javascript angularjs karma-jasmine

【解决方案1】：

检查加载角度模块的顺序。正如您在 karma conf 中列出的 javascript 文件一样，请查看模块定义的文件是否在使用它的其他文件之前首先加载。

调整此列表中的顺序，显式加载定义“material.controllers”模块的文件。

files: [
  '/home/tanpham/Angular/Dev/libs/angular/angular.js',
  '/home/tanpham/Angular/Dev/js/**/*.js',
  '/home/tanpham/Angular/Dev/js/*.js',
  '/home/tanpham/Angular/Test/*.js'
],

【讨论】：

非常感谢您的评论。在上面的示例中，顺序应该是'/home/tanpham/Angular/Dev/js/*.js', '/home/tanpham/Angular/Dev/js/**/*.js',，然后整个事情应该再次起作用。

【解决方案2】：

我遇到了这个问题。并解决了它。只需在模块声明语句中的模块名称后面添加“，[]”即可。在这种情况下，更改代码将是：

angular.module('material.controllers',[])
 .controller('LoginController', function($scope) {

  $scope.name = "Ari";
  $scope.sayHello = function() {
     $scope.greeting = "Hello " + $scope.name;
  }
});

【讨论】：

这实际上是我的问题，所以谢谢你的回答。然而，具有讽刺意味的是，这并没有真正回答 OP 在他的情况下展示的问题，但确实有助于我用来加载模块的方法。