使用Gulp运行Karma测试时出现“模块未定义”错误

Question

我的团队正在从Grunt转移到Gulp。我有一个Grunt测试任务可以正常工作，但是当我尝试运行测试（使用gulp-karma）时，会出现错误，显示“ReferenceError: Can't find variable: module”。

我通过谷歌搜索发现很多帖子都建议检查我的angular-mocks.js文件的位置，而它在正确的位置（我的相同代码的Grunt任务确实可以工作）。

为了验证这不是我的代码中的奇怪问题，我启动了一个新的yo angular应用程序，并能够复制该错误。

我猜测我缺少一个配置值或一些步骤等等。有什么建议吗？

谢谢。

- James Bender

---

你能分享你的代码吗？我的猜测是，如果你正在使用yeoman gulp生成器通过Gulp运行测试，那么你可能没有将文件加载到unit-test.js中。这是我在未看到代码的情况下唯一的推测。 - mcranston18

@mcranston18 当然，我可以分享我创建的空项目中你需要查看的任何内容。你需要什么？ - James Bender

你有一个可以重现这个问题的 GitHub 仓库链接吗？ - Jay Harris

@JayHarris 是的，https://github.com/JamesBender/GulpTest - James Bender

Answer 1

@mcranston18的答案绝对可行。但作为另一种选择，gulp-karma是目前不必要的插件之一。使用gulp的优势之一是您不必为所有事情都使用插件。相反，您可以直接连接到karma。

var gulp = require('gulp');
var karma = require('karma').server;

gulp.task('tests', function(done) {
  return karma.start({
      configFile: __dirname + '/test/karma.conf.js',
      singleRun: true
    }, done);
});

- Jay Harris

---

从未想过这个，但似乎是更可取的解决方案。如果生成器采用这种方法就好了。 - mcranston18

我得到了以下错误：TypeError: Object #<Object>没有方法“start”。 - mcranston18

你是否通过 NPM 安装了 karma？ - Jay Harris

Answer 2

当你运行gulp tests时，gulp-karma会在gulpfile.js中查找文件，而不是你定义的karma.conf.js。请记住，当你返回gulp.src(tests)时，你传递了测试所需的文件数组。

要解决这个问题，在你的gulpfile.js中，更新你的tests数组以包含你的bower文件、app文件和测试文件：

var tests = [
  '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',
  'app/scripts/app.js',
  'app/scripts/**/*.js',
  'test/mock/**/*.js',
  'test/spec/**/*.js'
];

由于这些数组并不需要，因此您可以删除 karma.conf.js 中的 files 数组。

（顺便说一句，我还提到了 app.js，因为 app/scripts/**/*.js 不会匹配需要首先加载的 app.js）

- mcranston18

---

这也在 gulp-karma#27 中有所提及，是 gulp-karma 的主要问题之一。他们正在努力寻找潜在的解决方案。 - Jay Harris

顺便提一下，如果您想在 karma.conf.js 中定义文件，只需将一个空数组传递给 gulp.src（即 return gulp.src([]) ）。 - mcranston18