使用 karma-systemjs 为依赖项生成 404

Using karma-systemjs produces 404 for dependencies

我正在我的应用程序上设置单元测试。我的基本测试规格 project.spec.ts 看起来像

import {Project} from './project';

describe('Project', () => {
    let p = new Project('New project');

    it('should have the name given in the constructor', () => {
        expect(p.name).toBe('New project');
    });
});

Project 是我正在测试的 class 的名称,它在文件 app/entities/project.ts 中定义(即在同一文件夹中)。

但是,每当测试规范尝试导入另一个文件时,karma 都会产生 404 错误:

01 03 2016 17:21:04.955:WARN [web-server]: 404: /base/app/entities/project
Chrome 48.0.2564 (Windows 10 0.0.0) ERROR
  Error: XHR error (404 Not Found) loading C:/Dev/mps/app/entities/project
        Error loading C:/Dev/mps/app/entities/project as "./project" from C:/Dev/mps/app/entities/project.spec.js

看起来编译文件project.spec.js加载正确,但是文件project.js加载失败。另外,我不明白/base/app/entities/project中的前缀/base/是从哪里来的。

描述了一个类似的案例here。但是,建议的解决方案对我不起作用。以下导入变体均无​​效:

let Project = require('./project');
let Project = System.import('./project'); // produces "404: /project" instead
let Project = require('./project.js');
let Project = System.import('./project.js');

我的配置是:

karma.conf.js

module.exports = function(config) {
  config.set({
    basePath: '',
    plugins: ['karma-systemjs', 'karma-jasmine', 'karma-chrome-launcher'],
    frameworks: ['systemjs', 'jasmine'],
    systemjs: {
        configFile: 'system.conf.js'
    },
    files: [
      'app/entities/project.spec.js'
    ],
    exclude: [ ],
    preprocessors: { },
    reporters: ['progress'],
    port: 9876,
    colors: true,
    logLevel: config.LOG_INFO,
    autoWatch: true,
    browsers: ['Chrome'],
    singleRun: false,
    concurrency: Infinity
  })
}

system.conf.js

System.config({
    paths: {
        'traceur': 'node_modules/traceur/bin/traceur.js',
        'systemjs': 'node_modules/systemjs/dist/system.js',
        'system-polyfills': 'node_modules/systemjs/dist/system-polyfills.js',
        'es6-module-loader': 'node_modules/es6-module-loader/dist/es6-module-loader.js'
    }
});

我做错了什么?

知道了。引用的文件必须提供给 SystemJS。这可以通过 karma.conf.js:

中的参数 systemjs.serveFiles 来完成
systemjs: {
  serveFiles: [
    'app/entities/project.js'
  ]
}

更好的方法是使用 globs 只配置一次此参数:

systemjs: {
  serveFiles: [
    'node_modules/**/*.js',
    'app/**/*.js'
  ]
}