当通过angular-cli(ng test -cc)运行带代码覆盖率的测试时,karma会抛出下面的错误。罪魁祸首似乎是 istanbul 代码覆盖模块,因为在没有-cc的情况下运行测试不会导致任何错误。
错误(我用***替换了本地路径):
at Object.exports.default (***\node_modules\istanbul-instrumenter-loader\dist\index.js:25:16),Module build failed: SyntaxError: 'import' and 'export' may appear only with 'sourceType: "module"' (1:0)
at Parser.pp$5.raise (***\node_modules\babylon\lib\index.js:4454:13)
at Parser.pp$1.parseStatement (***\node_modules\babylon\lib\index.js:1881:16)
at Parser.parseStatement (***\node_modules\babylon\lib\index.js:5910:22)
at Parser.pp$1.parseBlockBody (***\node_modules\babylon\lib\index.js:2268:21)
at Parser.pp$1.parseTopLevel (***\node_modules\babylon\lib\index.js:1778:8)
at Parser.parse (***\node_modules\babylon\lib\index.js:1673:17)
at Object.parse (***\node_modules\babylon\lib\index.js:7305:37)
at Instrumenter.instrumentSync (***\node_modules\istanbul-lib-instrument\dist\instrumenter.js:121:31)
at Instrumenter.instrument (***\node_modules\istanbul-lib-instrument\dist\instrumenter.js:176:32)
at Object.exports.default (***\node_modules\istanbul-instrumenter-loader\dist\index.js:25:16)
at Compiler.compiler.plugin (***\node_modules\@angular\cli\plugins\karma-webpack-throw-error.js:10:23)
at Compiler.applyPlugins (***\node_modules\tapable\lib\Tapable.js:61:14)
at Watching._done (***\node_modules\webpack\lib\Compiler.js:92:17)
at onCompiled (***\node_modules\webpack\lib\Compiler.js:51:17)
at ***\node_modules\webpack\lib\Compiler.js:494:13
at next (***\node_modules\tapable\lib\Tapable.js:202:11)
at Compiler.<anonymous> (***\node_modules\webpack\lib\CachePlugin.js:62:5)
at Compiler.applyPluginsAsyncSeries (***\node_modules\tapable\lib\Tapable.js:206:13)
at ***\node_modules\webpack\lib\Compiler.js:491:10
at Compilation.applyPluginsAsyncSeries (***\node_modules\tapable\lib\Tapable.js:195:46)
at self.applyPluginsAsync.err (***\node_modules\webpack\lib\Compilation.js:645:19)
at next (***\node_modules\tapable\lib\Tapable.js:202:11)
at Compilation.compilation.plugin (***\node_modules\webpack\lib\ProgressPlugin.js:121:6)
at Compilation.applyPluginsAsyncSeries (***\node_modules\tapable\lib\Tapable.js:206:13)
at self.applyPluginsAsync.err (***\node_modules\webpack\lib\Compilation.js:636:11)
at next (***\node_modules\tapable\lib\Tapable.js:202:11)
的package.json:
{
"name": "texteditorapplication",
"version": "1.1.0",
"license": "MIT",
"scripts": {
***
},
"private": true,
"dependencies": {
"@angular/animations": "4.2.3",
"@angular/common": "4.2.3",
"@angular/compiler": "4.2.3",
"@angular/core": "4.2.3",
"@angular/forms": "4.2.3",
"@angular/http": "4.2.3",
"@angular/platform-browser": "4.2.3",
"@angular/platform-browser-dynamic": "4.2.3",
"@angular/router": "4.2.3",
"@ngrx/core": "1.2.0",
"@ngrx/db": "2.0.2",
"@ngrx/effects": "2.0.3",
"@ngrx/router-store": "1.2.6",
"@ngrx/store": "2.2.2",
"@ngrx/store-devtools": "3.1.0",
"@ngrx/store-log-monitor": "3.0.2",
"bootstrap": "3.3.7",
"core-js": "2.4.1",
"linqts": "1.8.2",
"loader-utils": "^1.1.0",
"ngrx-store-freeze": "0.1.0",
"ngx-bootstrap": "2.0.0-beta.2",
"rxjs": "5.4.1",
"web-animations-js": "2.2.2",
"typescript": "2.3.4",
"zone.js": "0.8.6"
},
"devDependencies": {
"@angular/cli": "1.2.7",
"@angular/compiler-cli": "4.2.3",
"@ngrx/store": "^2.2.1",
"@types/jasmine": "2.5.38",
"@types/node": "6.0.64",
"@types/reflect-metadata": "0.0.5",
"codelyzer": "2.0.1",
"copyfiles": "1.2.0",
"enhanced-resolve": "3.3.0",
"jasmine-core": "2.5.2",
"jasmine-spec-reporter": "3.2.0",
"karma": "1.7.1",
"karma-chrome-launcher": "2.0.0",
"karma-cli": "1.0.1",
"karma-jasmine": "1.1.0",
"karma-jasmine-html-reporter": "0.2.2",
"karma-phantomjs2-launcher": "v0.5.0",
"karma-coverage-istanbul-reporter": "1.3.0",
"istanbul-instrumenter-loader": "3.0.0",
"less-cli": "1.0.0",
"phantomjs-prebuilt": "v2.1.16",
"protractor": "5.1.0",
"rimraf": "2.6.1",
"ts-node": "2.0.0",
"tslint": "4.5.0",
"typescript": "2.3.4"
}
}
karma.conf.json
module.exports = function (config) {
config.set({
basePath: '',
frameworks: ['jasmine', '@angular/cli'],
plugins: [
require('@angular/cli/plugins/karma'),
require('karma-jasmine'),
require('karma-chrome-launcher'),
require('karma-jasmine-html-reporter'),
require('karma-coverage-istanbul-reporter')
],
client: {
clearContext: false // leave Jasmine Spec Runner output visible in browser
},
files: [
{ pattern: './src/test.ts', watched: false }
],
preprocessors: {
'./src/test.ts': ['@angular/cli']
},
mime: {
'text/x-typescript': ['ts', 'tsx']
},
coverageIstanbulReporter: {
reports: ['html', 'lcovonly'],
fixWebpackSourcePaths: true
},
angularCli: {
environment: 'dev'
},
reporters: config.angularCli && config.angularCli.codeCoverage
? ['progress', 'coverage-istanbul']
: ['progress', 'kjhtml'],
port: 9876,
colors: true,
logLevel: config.LOG_DEBUG,
autoWatch: true,
browsers: ['ChromeHeadless'],
customLaunchers: {
"ChromeHeadless": {
base: 'Chrome',
flags: ['--headless', '--remote-debugging-port=9222', '--no-sandbox']
}
},
singleRun: false
});
};
tsconfig.json
{
"compileOnSave": false,
"compilerOptions": {
"outDir": "./dist/out-tsc",
"baseUrl": "src",
"sourceMap": true,
"declaration": false,
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"target": "es5",
"module": "es6",
"typeRoots": [
"node_modules/@types"
],
"paths": {
"@angular/*": [
"../node_modules/@angular/*"
],
"@ngrx/*": [
"../node_modules/@ngrx/*"
],
"ngx-bootstrap/*": [
"../node_modules/ngx-bootstrap/*"
],
"rxjs/*": [
"../node_modules/rxjs/*"
],
"afw/*": [
"../node_modules/afw/*"
]
},
"lib": [
"es2016",
"dom"
]
}
}
tsconfig.spec.json
{
"extends": "../tsconfig.json",
"parserOptions": {
"ecmaVersion": 6,
"sourceType": "module"
},
"compilerOptions": {
"allowSyntheticDefaultImports": true,
"module": "commonjs",
"target": "es5",
"outDir": "../out-tsc/spec",
"baseUrl": "",
"types": [
"jasmine",
"node"
],
"traceResolution": true
},
"files": [
"test.ts"
],
"include": [
"**/*.spec.ts",
"**/*.d.ts"
]
}
请帮助,因为我似乎无法找到解决方案,并且现在也失去了在遇到此错误时不翻转表的能力。我这里的桌子用完了。
答案 0 :(得分:0)
<强> karma.conf.js 强>
config.set({
...
files: [
'test/index.js'
],
preprocessors: {
'test/index.js': 'webpack'
},
webpack: {
...
module: {
rules: [
// instrument only testing sources with Istanbul
{
test: /\.js$/,
use: { loader: 'istanbul-instrumenter-loader' },
include: path.resolve('src/components/')
}
]
}
...
},
reporters: [ 'progress', 'coverage-istanbul' ],
coverageIstanbulReporter: {
reports: [ 'text-summary' ],
fixWebpackSourcePaths: true
}
...
});
&#13;
如https://www.npmjs.com/package/istanbul-instrumenter-loader中所述,您应该将您的包包含在karma.conf.js;
中您的conf中只有instanbul-reporter
而不是instrumenter-loader
。尝试添加它。
希望这有帮助