使用 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'
]
}
我正在我的应用程序上设置单元测试。我的基本测试规格 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'
]
}