Error after including plugins in karma.config.js

Question

This is my code inside karma.config.js:

I'm using Webpack 3+ for my project.

module.exports = config => {
  config.set({
    basePath: '',
    frameworks: ['jasmine'],
    files: ['./src/components/**/*.spec.ts'],
    plugins: ['karma-jasmine', 'karma-phantomjs-launcher'],
    preprocessors: {
      './src/components/**/*.spec.ts': ['webpack']
    },
    mime: {
      'text/x-typescript': ['ts', 'tsx']
    },
    webpack: webpackConfig,
    reporters: ['progress'],
    port: 9876,
    colors: true,
    logLevel: config.LOG_INFO,
    autoWatch: true,
    browsers: ['Chrome'],
    singleRun: false,
    webpackMiddleware: {
      noInfo: true
    },
    concurrency: Infinity
  });
};

After I've included this line of code:

 plugins: ['karma-jasmine', 'karma-phantomjs-launcher'],

I got the following error:

Can not load "webpack", it is not registered!

If I don't have this line, everything runs smoothly. The problem is I have to implement PhantomJS. How can I resolve the issue?

Then as a guess, here is an open case for webpack: https://github.com/vlkosinov/karma-chai-as-promised/issues/5 that could be related, but might be that for some reason the plugin being used by webpack could not be loaded properly and then the registration of webpack failed... — juan garcia, Mar 01 '18 at 08:53

Steve Holgado · Answer 1 · 2018-03-01T09:10:02.343

By default, Karma loads all sibling NPM modules which have a name starting with karma-*.

Looks like you are overriding plugins with a new array, which will stop any karma webpack plugins from being loaded.

Therefore, when specifying a new plugins array you should add karma-* to it:

plugins: ['karma-*', 'karma-jasmine', 'karma-phantomjs-launcher'],

However, as your plugins are karma- prefixed anyway, they should be loaded automatically with the default plugins config so you shouldn’t need to specify a plugins array in this case.

I hope this helps.

Error after including plugins in karma.config.js

1 Answers1