javascript - How do I get karma to set webpack's mode to development? - Stack Overflow

admin管理员组

文章数量:1026298

When I run karma, I'm getting the following warning:

WARNING in configuration The 'mode' option has not been set, webpack will fallback to 'production' for this value. Set 'mode' option to 'development' or 'production' to enable defaults for each environment. You can also set it to 'none' to disable any default behavior. Learn more: /

I tried adding mode: 'development' to my webpack-test.config.js file as suggested in the link above, but not only did that fail to make any difference, Intellij IDEA plained:

webpack: Property 'mode' is not allowed

My unit testing does run anyway, but I'd like to get rid of this warning. Any help is much appreciated.

Here's my webpack-test.config.js file:

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

const ROOT = path.resolve( __dirname, 'src' );

module.exports = {
  mode: 'production',
  context: ROOT,

  resolve: {
    extensions: ['.ts', '.js'],
    modules: [
      ROOT,
      'node_modules'
    ]
  },

  module: {
    rules: [
      // PRE-LOADERS
      {
        enforce: 'pre',
        test: /\.js$/,
        use: 'source-map-loader'
      },

      // LOADERS
      {
        test: /\.ts$/,
        exclude: [ /node_modules/ ],
        use: 'ts-loader'
      }
    ]
  },

  devtool: 'cheap-module-source-map',
  devServer: {}
};

My karma.conf.js:

module.exports = function (config) {
  config.set({
    basePath: '',
    frameworks: ['jasmine'],
    plugins: [
      require('karma-jasmine'),
      require('karma-chrome-launcher'),
      require('karma-jasmine-html-reporter'),
      require('karma-coverage-istanbul-reporter'),
      require('karma-webpack')
    ],
    client:{
      clearContext: false // leave Jasmine Spec Runner output visible in browser
    },
    coverageIstanbulReporter: {
      reports: [ 'html', 'lcovonly' ],
      fixWebpackSourcePaths: true
    },
    reporters: ['progress', 'kjhtml'],
    port: 9876,
    colors: true,
    logLevel: config.LOG_INFO,
    autoWatch: true,
    browsers: ['Chrome'],
    singleRun: false,
    files: [
      'spec.bundle.js'
    ],
    preprocessors: {
      'spec.bundle.js': ['webpack']
    },
    webpack: require('./webpack-test.config')
  });
};

And spec.bundle.js:

const testsContext = require.context("./", true, /\.spec\.ts$/);
testsContext.keys().forEach(testsContext);

I'm launching karma via:

karma start ./karma.conf.js

When I run karma, I'm getting the following warning:

WARNING in configuration The 'mode' option has not been set, webpack will fallback to 'production' for this value. Set 'mode' option to 'development' or 'production' to enable defaults for each environment. You can also set it to 'none' to disable any default behavior. Learn more: https://webpack.js/concepts/mode/

I tried adding mode: 'development' to my webpack-test.config.js file as suggested in the link above, but not only did that fail to make any difference, Intellij IDEA plained:

webpack: Property 'mode' is not allowed

My unit testing does run anyway, but I'd like to get rid of this warning. Any help is much appreciated.

Here's my webpack-test.config.js file:

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

const ROOT = path.resolve( __dirname, 'src' );

module.exports = {
  mode: 'production',
  context: ROOT,

  resolve: {
    extensions: ['.ts', '.js'],
    modules: [
      ROOT,
      'node_modules'
    ]
  },

  module: {
    rules: [
      // PRE-LOADERS
      {
        enforce: 'pre',
        test: /\.js$/,
        use: 'source-map-loader'
      },

      // LOADERS
      {
        test: /\.ts$/,
        exclude: [ /node_modules/ ],
        use: 'ts-loader'
      }
    ]
  },

  devtool: 'cheap-module-source-map',
  devServer: {}
};

My karma.conf.js:

module.exports = function (config) {
  config.set({
    basePath: '',
    frameworks: ['jasmine'],
    plugins: [
      require('karma-jasmine'),
      require('karma-chrome-launcher'),
      require('karma-jasmine-html-reporter'),
      require('karma-coverage-istanbul-reporter'),
      require('karma-webpack')
    ],
    client:{
      clearContext: false // leave Jasmine Spec Runner output visible in browser
    },
    coverageIstanbulReporter: {
      reports: [ 'html', 'lcovonly' ],
      fixWebpackSourcePaths: true
    },
    reporters: ['progress', 'kjhtml'],
    port: 9876,
    colors: true,
    logLevel: config.LOG_INFO,
    autoWatch: true,
    browsers: ['Chrome'],
    singleRun: false,
    files: [
      'spec.bundle.js'
    ],
    preprocessors: {
      'spec.bundle.js': ['webpack']
    },
    webpack: require('./webpack-test.config')
  });
};

And spec.bundle.js:

const testsContext = require.context("./", true, /\.spec\.ts$/);
testsContext.keys().forEach(testsContext);

I'm launching karma via:

karma start ./karma.conf.js

• javascript
• unit-testing
• webpack
• jasmine
• karma-runner

Share Improve this question Follow asked May 17, 2018 at 3:25 kshetlinekshetline 13.8k66 gold badges4949 silver badges9292 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 4

I stumbled on this by trial and error, replacing:

webpack: require('./webpack-test.config')

...in karma.conf.js with:

webpack: {
  mode: 'development'
}

...and the warning is gone. Not only that, I discovered that I really didn't need my webpack-test.config, nor the two npm modules I'd loaded to support it, source-map-loader and ts-loader.

If someone really did want to both specify mode: 'development' and specify a particular webpack config file, I'm not sure how they'd do it. I experimented with a few options and couldn't find anything that would work. This stuff doesn't have great documentation :(

You shouldn't have to require the webpack package in your config file. Not sure if that is causing Intellij to get confused or not, but mode is certainly a valid property of webpack.

https://webpack.js/concepts/mode/

I also noticed that in your karma.conf.js file, the line webpack: require('./webpack-test.config') is missing the .js extension for the config file. That may be why your config settings are not reflected in your karma test.

When I run karma, I'm getting the following warning:

WARNING in configuration The 'mode' option has not been set, webpack will fallback to 'production' for this value. Set 'mode' option to 'development' or 'production' to enable defaults for each environment. You can also set it to 'none' to disable any default behavior. Learn more: /

I tried adding mode: 'development' to my webpack-test.config.js file as suggested in the link above, but not only did that fail to make any difference, Intellij IDEA plained:

webpack: Property 'mode' is not allowed

My unit testing does run anyway, but I'd like to get rid of this warning. Any help is much appreciated.

Here's my webpack-test.config.js file:

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

const ROOT = path.resolve( __dirname, 'src' );

module.exports = {
  mode: 'production',
  context: ROOT,

  resolve: {
    extensions: ['.ts', '.js'],
    modules: [
      ROOT,
      'node_modules'
    ]
  },

  module: {
    rules: [
      // PRE-LOADERS
      {
        enforce: 'pre',
        test: /\.js$/,
        use: 'source-map-loader'
      },

      // LOADERS
      {
        test: /\.ts$/,
        exclude: [ /node_modules/ ],
        use: 'ts-loader'
      }
    ]
  },

  devtool: 'cheap-module-source-map',
  devServer: {}
};

My karma.conf.js:

module.exports = function (config) {
  config.set({
    basePath: '',
    frameworks: ['jasmine'],
    plugins: [
      require('karma-jasmine'),
      require('karma-chrome-launcher'),
      require('karma-jasmine-html-reporter'),
      require('karma-coverage-istanbul-reporter'),
      require('karma-webpack')
    ],
    client:{
      clearContext: false // leave Jasmine Spec Runner output visible in browser
    },
    coverageIstanbulReporter: {
      reports: [ 'html', 'lcovonly' ],
      fixWebpackSourcePaths: true
    },
    reporters: ['progress', 'kjhtml'],
    port: 9876,
    colors: true,
    logLevel: config.LOG_INFO,
    autoWatch: true,
    browsers: ['Chrome'],
    singleRun: false,
    files: [
      'spec.bundle.js'
    ],
    preprocessors: {
      'spec.bundle.js': ['webpack']
    },
    webpack: require('./webpack-test.config')
  });
};

And spec.bundle.js:

const testsContext = require.context("./", true, /\.spec\.ts$/);
testsContext.keys().forEach(testsContext);

I'm launching karma via:

karma start ./karma.conf.js

When I run karma, I'm getting the following warning:

WARNING in configuration The 'mode' option has not been set, webpack will fallback to 'production' for this value. Set 'mode' option to 'development' or 'production' to enable defaults for each environment. You can also set it to 'none' to disable any default behavior. Learn more: https://webpack.js/concepts/mode/

I tried adding mode: 'development' to my webpack-test.config.js file as suggested in the link above, but not only did that fail to make any difference, Intellij IDEA plained:

webpack: Property 'mode' is not allowed

My unit testing does run anyway, but I'd like to get rid of this warning. Any help is much appreciated.

Here's my webpack-test.config.js file:

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

const ROOT = path.resolve( __dirname, 'src' );

module.exports = {
  mode: 'production',
  context: ROOT,

  resolve: {
    extensions: ['.ts', '.js'],
    modules: [
      ROOT,
      'node_modules'
    ]
  },

  module: {
    rules: [
      // PRE-LOADERS
      {
        enforce: 'pre',
        test: /\.js$/,
        use: 'source-map-loader'
      },

      // LOADERS
      {
        test: /\.ts$/,
        exclude: [ /node_modules/ ],
        use: 'ts-loader'
      }
    ]
  },

  devtool: 'cheap-module-source-map',
  devServer: {}
};

My karma.conf.js:

module.exports = function (config) {
  config.set({
    basePath: '',
    frameworks: ['jasmine'],
    plugins: [
      require('karma-jasmine'),
      require('karma-chrome-launcher'),
      require('karma-jasmine-html-reporter'),
      require('karma-coverage-istanbul-reporter'),
      require('karma-webpack')
    ],
    client:{
      clearContext: false // leave Jasmine Spec Runner output visible in browser
    },
    coverageIstanbulReporter: {
      reports: [ 'html', 'lcovonly' ],
      fixWebpackSourcePaths: true
    },
    reporters: ['progress', 'kjhtml'],
    port: 9876,
    colors: true,
    logLevel: config.LOG_INFO,
    autoWatch: true,
    browsers: ['Chrome'],
    singleRun: false,
    files: [
      'spec.bundle.js'
    ],
    preprocessors: {
      'spec.bundle.js': ['webpack']
    },
    webpack: require('./webpack-test.config')
  });
};

And spec.bundle.js:

const testsContext = require.context("./", true, /\.spec\.ts$/);
testsContext.keys().forEach(testsContext);

I'm launching karma via:

karma start ./karma.conf.js

• javascript
• unit-testing
• webpack
• jasmine
• karma-runner

Share Improve this question Follow asked May 17, 2018 at 3:25 kshetlinekshetline 13.8k66 gold badges4949 silver badges9292 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 4

I stumbled on this by trial and error, replacing:

webpack: require('./webpack-test.config')

...in karma.conf.js with:

webpack: {
  mode: 'development'
}

...and the warning is gone. Not only that, I discovered that I really didn't need my webpack-test.config, nor the two npm modules I'd loaded to support it, source-map-loader and ts-loader.

If someone really did want to both specify mode: 'development' and specify a particular webpack config file, I'm not sure how they'd do it. I experimented with a few options and couldn't find anything that would work. This stuff doesn't have great documentation :(

You shouldn't have to require the webpack package in your config file. Not sure if that is causing Intellij to get confused or not, but mode is certainly a valid property of webpack.

https://webpack.js/concepts/mode/

I also noticed that in your karma.conf.js file, the line webpack: require('./webpack-test.config') is missing the .js extension for the config file. That may be why your config settings are not reflected in your karma test.

本文标签： javascriptHow do I get karma to set webpack39s mode to developmentStack Overflow