1

I am trying to set up karma to run with webpack in a very simple react app but since updating to webpack 2 all I get is errors when running my tests. Compiling the react app works perfectly tho. Anything in my webpack or karma config that might be causing this?

Here's my error: 

> NODE_ENV=test karma start


START:
(node:1370) DeprecationWarning: loaderUtils.parseQuery() received a non-string value which can be problematic, see https://github.com/webpack/loader-utils/issues/56
parseQuery() will be replaced with getOptions() in the next major version of loader-utils.
Error
    at MemoryFileSystem.mkdirpSync (/Users/rperez/devProjects/CamperLeaderBoard/node_modules/memory-fs/lib/MemoryFileSystem.js:144:10)
    at MemoryFileSystem.(anonymous function) [as mkdirp] (/Users/rperez/devProjects/CamperLeaderBoard/node_modules/memory-fs/lib/MemoryFileSystem.js:279:34)
    at Compiler.<anonymous> (/Users/rperez/devProjects/CamperLeaderBoard/node_modules/webpack/lib/Compiler.js:322:27)
    at /Users/rperez/devProjects/CamperLeaderBoard/node_modules/webpack/node_modules/async/dist/async.js:3022:16
    at eachOfArrayLike (/Users/rperez/devProjects/CamperLeaderBoard/node_modules/webpack/node_modules/async/dist/async.js:941:9)
    at eachOf (/Users/rperez/devProjects/CamperLeaderBoard/node_modules/webpack/node_modules/async/dist/async.js:991:5)
    at Object.eachLimit (/Users/rperez/devProjects/CamperLeaderBoard/node_modules/webpack/node_modules/async/dist/async.js:3086:3)
    at Compiler.emitFiles (/Users/rperez/devProjects/CamperLeaderBoard/node_modules/webpack/lib/Compiler.js:312:20)
    at Immediate.<anonymous> (/Users/rperez/devProjects/CamperLeaderBoard/node_modules/memory-fs/lib/MemoryFileSystem.js:288:4)
    at runCallback (timers.js:651:20)
    at tryOnImmediate (timers.js:624:5)
    at processImmediate [as _immediateCallback] (timers.js:596:5)

dependencies:

"dependencies": {
    "axios": "^0.15.3",
    "express": "^4.15.2",
    "react": "^15.4.2",
    "react-dom": "^15.4.2",
    "react-router": "^3.0.2"
  },
  "devDependencies": {
    "babel-core": "^6.23.1",
    "babel-loader": "^6.4.0",
    "babel-preset-es2015": "^6.22.0",
    "babel-preset-react": "^6.23.0",
    "babel-preset-stage-0": "^6.22.0",
    "css-loader": "^0.26.2",
    "expect": "^1.20.2",
    "foundation-sites": "^6.3.1",
    "jquery": "^3.1.1",
    "karma": "^1.5.0",
    "karma-chrome-launcher": "^2.0.0",
    "karma-mocha": "^1.3.0",
    "karma-mocha-reporter": "^2.2.2",
    "karma-sourcemap-loader": "^0.3.7",
    "karma-webpack": "^2.0.2",
    "mocha": "^3.2.0",
    "node-sass": "^4.5.0",
    "react-addons-test-utils": "^15.4.2",
    "sass-loader": "^6.0.2",
    "script-loader": "^0.7.0",
    "style-loader": "^0.13.2",
    "webpack": "^2.2.1"
  }

webpack config:

    const webpack = require('webpack');
    const path = require('path');

    //will be set to 'production on heroku'
    //process.env.NODE_ENV = process.env.NODE_ENV || 'development';

    module.exports = {
      //where to start the app
      entry: {
        app: path.resolve(__dirname, 'app/app.jsx'),
      },
      output: {
        path: path.resolve(__dirname, './public'),
        filename: '[name].bundle.js'
      },
      //setting up the babel loader to handle jsx files(es2015)
      module: {
        rules: [
          {
            test: /\.jsx?$/,
            exclude: /(node_modules|bower_componets)/,
            use: [{
              loader: 'babel-loader',
              options: {presets:['react', 'es2015', 'stage-0']}
            }],
          },
        ],
      },//end of modules
      resolve: {
        //Tell webpack what directories should be searched when resolving modules.
        modules: [
          path.join(__dirname, 'app/components'),
          path.join(__dirname, 'app/api'),
          'node_modules',
        ],
        //Automatically resolve certain extensions.
        extensions: ['.js', '.jsx', '.json'],
      }, //end of resolve
      //This option controls if and how Source Maps are generated.
      devtool:'cheap-module-eval-source-map'
    };//end of module.exports

karma config:

var webpackConfig = require('./webpack.config.js');

module.exports = function (config) {
  config.set({
    browsers: ['Chrome'],
    singleRun: true,
    frameworks: ['mocha'],
    files: [
      './app/tests/**/*.test.jsx'
    ],
    preprocessors: {
      './app/tests/**/*.test.jsx': ['webpack', 'sourcemap']
    },
    reporters: ['mocha'],
    client: {
      mocha: {
        timeout: '5000'
      }
    },
    webpack: webpackConfig,
    webpackServer: {
      noInfo: true
    }
  })
4

1 回答 1

1

我的问题是我需要从我的 webpack.config 中删除“entry”属性。我通过添加以下代码来做到这一点：

webpackConfig.entry = null;

感谢这篇启蒙文章： Error: not a directory at MemoryFileSystem.mkdirpSync

于 2017-03-30T17:34:07.940 回答