我正在尝试使用业力和Webpack中的打字稿为VUE文件创建代码覆盖率。
我在以后使用istanbul-instrumenter-loader作为后期处理,但是一直在获取。
对于纯.ts文件,一切正常,但是当包含vue文件时,我得到
build failed (from ./node_modules/istanbul-instrumenter-loader/dist/cjs.js):
TypeError: Cannot read property 'fileCoverage' of undefined
在调试istanbul-instrumenter-loader时,我注意到 ee.exit(path); 是未定义的,因为对VUE文件进行了3次检测,前两个工作正常,但第三个崩溃了。
这是我的webpack配置
module.exports = {
node: {
fs: 'empty'
},mode: 'development',devtool: 'inline-source-map',stats: 'verbose',resolve: {
alias: {
Home: path.resolve( __dirname ),Client: path.resolve( __dirname,'client/' ),ClientUtils$: path.resolve( __dirname,'client/utils/index.utils.client.ts' ),Views: path.resolve( __dirname,'client/views/' ),Components: path.resolve( __dirname,'client/components/' ),Constants$: path.resolve( buildPath,'shared/constants.js' )
},extensions: [
'.scss','.js','.ts','.vue'
]
},module: {
rules: [
{
test: /\.vue$/,use: [
{
loader: 'vue-loader'
}
]
},{
test: /\.ts?$/,exclude: /node_modules/,use: [
{
loader: 'cache-loader'
},{
loader: 'thread-loader',options: {
workers: Math.max(require('os').cpus().length - 1,1)
}
},{
loader: 'ts-loader',options: {
transpileonly: true,happypackMode: true,appendTsSuffixTo: [/\.vue$/]
}
}
]
},{
test: /\.js$/,exclude: [/dist/,/node_modules/,/coverage_server/,/coverage_client/],loader: 'babel-loader'
},{
test: /\.ts$/,include: [/client/],exclude: [
/node_modules/,/\.spec\.ts$/,/server/
],enforce: 'post',loader: 'istanbul-instrumenter-loader',options: {
esModules: true
}
},{
test: /\.(s*)css$/,use: [
'vue-style-loader','css-loader','sass-loader'
]
}
]
},plugins: [
new VueLoaderPlugin()
};
我的karma.conf是
module.exports = function(config) {
let files = [];
if (config.grep) {
files.push({ pattern: config.grep,type: 'module' });
} else {
files.push('client/index.client.spec.ts');
}
config.set({
frameworks: ["mocha","chai","sinon"],files,preprocessors: {
'client/**/*spec.ts': ['webpack','sourcemap']
},webpack: require('./webpack.test.js'),reporters: ['spec','dots','html','coverage-istanbul'],browsers: ['ChromeHeadless'],coverageReporter: {
dir: './coverage_client',includeAllSources: true,reporters: [{ type: 'lcov',subdir: '.' },{ type: 'text' }]
},coverageIstanbulReporter: {
reports: ['text','lcov' ],dir: './coverage_client',fixWebpackSourcePaths: true,'report-config': {
html: { outdir: 'html' }
}
},htmlReporter: {
outputDir: 'karma_client_html',// where to put the reports
templatePath: null,// set if you moved jasmine_template.html
focusOnFailures: true,// reports show failures on start
namedFiles: false,// name files instead of creating sub-directories
pageTitle: null,// page title for reports; browser info by default
urlFriendlyName: false,// simply replaces spaces with _ for files/dirs
reportName: 'report_summary_filename',// report summary filename; browser info by default
// experimental
preserveDescribenesting: false,// folded suites stay folded
foldAll: false // reports start folded (only with preserveDescribenesting)
}
});
};
我的tsconfig是
{
"compilerOptions": {
"incremental": true,"outDir": "./build/","target": "es2018","module": "CommonJS","lib": ["es2018","dom","dom.iterable"],"allowSyntheticDefaultImports": true,"inlinesourceMap": true,"sourceMap": false,"noImplicitAny": false,"strict": true,"alwaysStrict": true,"moduleResolution": "node","skipLibCheck": true,"esModuleInterop": true,"emitDecoratorMetadata": true,"experimentalDecorators": true,"types": [ "node","mocha","chai" ],"baseUrl": ".","paths": {
"type-graphql": ["./node_modules/type-graphql/dist/browser-shim.ts"],"Client/*": ["./client/*"],"ClientUtils": ["./client/utils/index.utils.client.js"],"Views/*": ["./client/views/"],"Components/*": ["./client/components/*"],"Constants": ["./shared/constants.ts"]
}
},"include": [
"./client/**/*.ts","./client/**/*.vue","./server/**/*.ts","./shared/**/*.ts"
],"exclude": [
"**/*.spec.ts","node_modules"
],"files": ["./vue-shims.d.ts"]
}