Karma: ERROR [preprocess]: Can not load "webpack"!

[wellyshen]

Hi Guys, I'am using the [email protected] with [email protected], currently I updating my webpack from 2.1.0-beta.25 to 2.1.0-beta.26, when I running npm test I encountered the following error, does anyone has the same issue?

Here's my karma.config:

'use strict'; // eslint-disable-line

const path = require('path');
const webpackConfig = require('../webpack/config.test.babel');

module.exports = (config) => {
  config.set({
    browsers: ['PhantomJS'],

    singleRun: true,

    frameworks: ['mocha'],

    files: ['./test-bundler.js'],

    preprocessors: {
      './test-bundler.js': ['webpack', 'sourcemap'],
    },

    reporters: ['mocha', 'coverage'],

    webpack: webpackConfig,

    // Make Webpack bundle generation quiet
    webpackMiddleware: {
      noInfo: true,
      stats: 'errors-only',
    },

    // Set the format of reporter
    coverageReporter: {
      dir: path.join(process.cwd(), './coverage'),
      reporters: [
        { type: 'html', subdir: 'html' },
        { type: 'lcov', subdir: 'lcov' },
        { type: 'text-summary', subdir: '.', file: 'text-summary.txt' },
      ],
    },
  });
};

[ghost]

Hey @wellyshen,

Came across the same issue. Traced it back to Webpack 2 error as the compiler was being instantiated. It seems like setting external modules in the configuration to true currently isn't supported by the validation schema. It throws the following error internally.

Specify dependencies that shouldn\'t be resolved by webpack, but should become dependencies of the resulting bundle. The kind of the dependency depends on `output.libraryTarget`.

Which led me to the following part of the configuration:

...
        externals: {
          'react/addons': true,
          'react/lib/ExecutionEnvironment': true,
          'react/lib/ReactContext': true,
        },
...

I read the Webpack documentation stating that setting the value to true was the same as mirroring the property name for the internal require statements. So I changed the externals to the following:

        externals: {
          'react/addons': 'react/addons',
          'react/lib/ExecutionEnvironment': 'react/lib/ExecutionEnvironment',
          'react/lib/ReactContext': 'react/lib/ReactContext',
        },

This should work as before. Still need to verify with some more tests. They are currently fixing this.

https://github.com/webpack/webpack/issues/3299

All the best,
Shalom

P.S. Awesome boilerplate repo's, great examples to learn from.

[wellyshen]

@Aktof Thanks it works :)

[robododge]

FYI - I ran into the same issue with my karama runtime when switching to Webpack2 for the first time. But my issue was simple mis-configuration of the new webpack2 module:rules. I found this by printing the error message from Exception object emitted by webpack. Karma did not print this message. This message is important and gives you exact detail as to what is wrong with your webpack configuration.

To diagnose, edit the webpack-karma.js from the node_modules directory and console.log the e.message

(around line 67 in webpack-karama.js)

var compiler;
  try {
    compiler = webpack(webpackOptions);
  } catch (e) {
    console.error(e.stack || e);
    if (e.details) {
      console.error(e.details);
    }
    if (e.message) {
      console.error(e.message);  //<-- Here!
    }
    throw e;
  }

[edmundo096]

@robododge Stumbled into this, had simple misconfiguration too (in my case, was configuration.resolve.extensions[0] should not be empty.). Thanks for the tip.

This edit is from 15 days ago: https://github.com/webpack-contrib/karma-webpack/commit/4216f1357d6ae3552762b3cf8e2d652b1286f6b9