2016-11-23 2 views
0

Ich habe eine Webanwendung gestartet, indem ich vue-hackernews-2.0 geändert habe. Ich fing an, auch Unit-Test dafür zu schreiben.Fehler im Zusammenhang mit dem Webpack beim Komponententest für Vue

Ich erhalte folgende webpack Fehler beim Gerät einrichten Test für vue Web-App:

23 11 2016 17:13:18.968:ERROR [preprocess]: Can not load "webpack"! 
    WebpackOptionsValidationError: Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema. 
- configuration has an unknown property 'vue'. These properties are valid: 
    object { amd?, bail?, cache?, context?, dependencies?, devServer?, devtool?, entry, externals?, loader?, module?, name?, node?, output?, plugins?, profile?, recordsInputPath?, recordsOutputPath?, recordsPath?, resolve?, resolveLoader?, stats?, target?, watch?, watchOptions? } 
    For typos: please correct them. 
    For loader options: webpack 2 no longer allows custom properties in configuration. 
    Loaders should be updated to allow passing options via loader options in module.rules. 
    Until loaders are updated one can use the LoaderOptionsPlugin to pass these options to the loader: 
    plugins: { 
     new webpack.LoaderOptionsPlugin({ 
     // test: /\.xxx$/, // may apply this only for some modules 
     options: { 
      vue: ... 
     } 
     }) 
    } 
- configuration.module has an unknown property 'preLoaders'. These properties are valid: 
    object { exprContextCritical?, exprContextRecursive?, exprContextRegExp?, exprContextRequest?, loaders?, noParse?, rules?, unknownContextCritical?, unknownContextRecursive?, unknownContextRegExp?, unknownContextRequest?, wrappedContextCritical?, wrappedContextRecursive?, wrappedContextRegExp? } 
    Options affecting the normal modules (`NormalModuleFactory`). 
    at webpack (/Users/saurabh.mimani/work/codes/jeeves/vue/node_modules/webpack/lib/webpack.js:16:9) 
    at new Plugin (/Users/saurabh.mimani/work/codes/jeeves/vue/node_modules/karma-webpack/lib/karma-webpack.js:63:18) 
    at invoke (/Users/saurabh.mimani/work/codes/jeeves/vue/node_modules/di/lib/injector.js:75:15) 
    at Array.instantiate (/Users/saurabh.mimani/work/codes/jeeves/vue/node_modules/di/lib/injector.js:59:20) 
    at get (/Users/saurabh.mimani/work/codes/jeeves/vue/node_modules/di/lib/injector.js:48:43) 
    at /Users/saurabh.mimani/work/codes/jeeves/vue/node_modules/di/lib/injector.js:71:14 
    at Array.map (native) 
    at Array.invoke (/Users/saurabh.mimani/work/codes/jeeves/vue/node_modules/di/lib/injector.js:70:31) 
    at Injector.get (/Users/saurabh.mimani/work/codes/jeeves/vue/node_modules/di/lib/injector.js:48:43) 
    at instantiatePreprocessor (/Users/saurabh.mimani/work/codes/jeeves/vue/node_modules/karma/lib/preprocessor.js:55:20) 
    at Array.forEach (native) 
    at createPreprocessor (/Users/saurabh.mimani/work/codes/jeeves/vue/node_modules/karma/lib/preprocessor.js:74:20) 
    at Array.invoke (/Users/saurabh.mimani/work/codes/jeeves/vue/node_modules/di/lib/injector.js:75:15) 
    at get (/Users/saurabh.mimani/work/codes/jeeves/vue/node_modules/di/lib/injector.js:48:43) 
    at /Users/saurabh.mimani/work/codes/jeeves/vue/node_modules/di/lib/injector.js:71:14 
    at Array.map (native) 
23 11 2016 17:13:19.006:WARN [karma]: No captured browser, open http://localhost:9876/ 
23 11 2016 17:13:19.017:INFO [karma]: Karma v1.3.0 server started at http://localhost:9876/ 
23 11 2016 17:13:19.017:INFO [launcher]: Launching browsers Chrome, Firefox, PhantomJS with unlimited concurrency 
23 11 2016 17:13:19.018:ERROR [karma]: Found 1 load error 

Es folgt mein karma.conf.js:

// Karma configuration 
// Generated on Wed Nov 23 2016 13:59:48 GMT+0530 (IST) 

var path = require('path') 
var merge = require('webpack-merge') 
var baseConfig = require('../build/webpack.base.config') 
var projectRoot = path.resolve(__dirname, '../') 

var webpackConfig = merge(baseConfig, { 
    // use inline sourcemap for karma-sourcemap-loader 
    devtool: '#inline-source-map', 
    vue: { 
    loaders: { 
     js: 'isparta' 
    } 
    } 
}) 

// no need for app entry during tests 
delete webpackConfig.entry 

// make sure isparta loader is applied before eslint 
webpackConfig.module.preLoaders.unshift({ 
    test: /\.js$/, 
    loader: 'isparta', 
    include: projectRoot, 
    exclude: /test\/unit|node_modules/ 
}) 

// only apply babel for test files when using isparta 
webpackConfig.module.rules.some(function (loader, i) { 
    if (loader.loader === 'babel') { 
    loader.include = /test\/unit/ 
    return true 
    } 
}) 

module.exports = function(config) { 
    config.set({ 

    // base path that will be used to resolve all patterns (eg. files, exclude) 
    basePath: '', 
    frameworks: ['jasmine'], 
    files: ['./index.js'], 

    // list of files to exclude 
    exclude: [ 
    ], 


    // preprocess matching files before serving them to the browser 
    // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor 
    preprocessors: { 
     './index.js': ['webpack'] 
    }, 
    webpack: webpackConfig, 
    webpackMiddleware: { 
     noInfo: true 
    }, 
    // test results reporter to use 
    // possible values: 'dots', 'progress' 
    // available reporters: https://npmjs.org/browse/keyword/karma-reporter 
    reporters: ['spec', 'coverage', 'progress'], 
    coverageReporter: { 
     dir: './coverage', 
     reporters: [ 
     { type: 'lcov', subdir: '.' }, 
     { type: 'text-summary' } 
     ] 
    }, 


    // web server port 
    port: 9876, 


    // enable/disable colors in the output (reporters and logs) 
    colors: true, 


    // level of logging 
    // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG 
    logLevel: config.LOG_INFO, 


    // enable/disable watching file and executing tests whenever any file changes 
    autoWatch: true, 


    // start these browsers 
    // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher 
    browsers: ['Chrome', 'Firefox', 'PhantomJS'], 


    // Continuous Integration mode 
    // if true, Karma captures browsers, runs the tests and exits 
    singleRun: false, 

    // Concurrency level 
    // how many browser should be started simultaneous 
    concurrency: Infinity 
    }) 
} 

sind die folgenden Versionen:

"vue": "^2.0.0", 
"karma": "^1.3.0", 
"karma-chrome-launcher": "^2.0.0", 
"karma-coverage": "^1.1.1", 
"karma-firefox-launcher": "^1.0.0", 
"karma-jasmine": "^1.0.2", 
"karma-mocha": "^1.3.0", 
"karma-phantomjs-launcher": "^1.0.2", 
"karma-spec-reporter": "0.0.26", 
"karma-webpack": "^1.8.0", 
"vue-loader": "^9.7.0", 
"webpack": "^2.1.0-beta.25", 
"webpack-dev-middleware": "^1.6.1", 
"webpack-hot-middleware": "^2.12.2", 
"webpack-merge": "^0.17.0" 
+1

Verwenden Sie .vue-Dateien? Sie haben vue-loader installiert, aber ich kann es nicht in Ihrer Webpack-Konfiguration sehen? – lkostka

+0

@Ikostke Ich habe das in webpack.base.config. – Saurabh

Antwort

0

Sie verwenden eine Konfiguration für Webpack 1.x, aber Ihre Die Webpack-Version ist 2.x.

In Webpack 1.x könnten Sie benutzerdefinierte Optionen auf der Konfiguration haben. Vue nutzte dies, indem er eine vue-Eigenschaft in der Konfiguration verwendete. Jetzt können Sie dies in webpack 2.x nicht tun.

Hackernews unterstützt jetzt webpack 2.x, wenn Sie also eine neue Version herunterladen, wird es korrekt kompiliert.

Verwandte Themen