karma-babel-preprocessor
Preprocessor to compile ES6 on the fly with babel.
Last updated a year ago by shuhei .
ISC · Repository · Bugs · Original npm · Tarball · package.json
$ cnpm install karma-babel-preprocessor 
SYNC missed versions from official npm registry.

build status npm version npm downloads

karma-babel-preprocessor

Preprocessor to compile ES6 on the fly with babel.

babel and karma-babel-preprocessor only convert ES6 modules to CommonJS/AMD/SystemJS/UMD. If you choose CommonJS, you still need to resolve and concatenate CommonJS modules on your own. We recommend karma-browserify + babelify or webpack + babel-loader in such cases.

Installation

With babel 7.x:

npm install karma-babel-preprocessor @babel/core @babel/preset-env --save-dev

With babel 6.x:

npm install karma-babel-preprocessor@7 babel-core babel-preset-env --save-dev

As of Babel 6.0, you need to tell Babel which features to use. @babel/preset-env would be the most common one.

Configuration

See babel options for more details.

Given options properties are passed to babel.

In addition to the options property, you can configure any babel options with function properties. This is useful when you want to give different babel options from file to file.

For example, inline sourcemap configuration would look like the following.

module.exports = function (config) {
  config.set({
    preprocessors: {
      'src/**/*.js': ['babel'],
      'test/**/*.js': ['babel']
    },
    babelPreprocessor: {
      options: {
        presets: ['@babel/preset-env'],
        sourceMap: 'inline'
      },
      filename: function (file) {
        return file.originalPath.replace(/\.js$/, '.es5.js');
      },
      sourceFileName: function (file) {
        return file.originalPath;
      }
    }
  });
};

Don't preprocess third-party libraries

Third-party libraries may not work properly if you apply karma-babel-preprocessor to them. It also introduces unnecessary overhead. Make sure to explicitly specify files that you want to preprocess.

OK:

module.exports = function (config) {
  config.set({
    preprocessors: {
      'src/**/*.js': ['babel'],
      'test/**/*.js': ['babel']
    },
    // ...
  });
};

NG:

module.exports = function (config) {
  config.set({
    preprocessors: {
      './**/*.js': ['babel']
    },
    // ...
  });
};

Because it preprocesses files in node_modules and may break third-party libraries like jasmine #18.

Polyfill

If you need polyfill, make sure to include it in files.

npm install @babel/polyfill --save-dev
module.exports = function (config) {
  config.set({
    files: [
      'node_modules/@babel/polyfill/dist/polyfill.js',
      // ...
    ],
    // ...
  });
});

Karma's plugins option

In most cases, you don't need to explicitly specify plugins option. By default, Karma loads all sibling NPM modules which have a name starting with karma-*. If need to do so for some reason, make sure to include 'karma-babel-preprocessor' in it.

module.exports = function (config) {
  config.set({
    plugins: [
     'karma-jasmine',
     'karma-chrome-launcher',
     'karma-babel-preprocessor'
    ],
    // ...
  });
};

Custom preprocessor

karma-babel-preprocessor supports custom preprocessor. Set base: 'babel' in addition to normal preprocessor config.

module.exports = function (config) {
  config.set({
    preprocessors: {
      'src/**/*.js': ['babelSourceMap'],
      'test/**/*.js': ['babelSourceMap']
    },
    customPreprocessors: {
      babelSourceMap: {
        base: 'babel',
        options: {
          presets: ['@babel/preset-env'],
          sourceMap: 'inline'
        },
        filename: function (file) {
          return file.originalPath.replace(/\.js$/, '.es5.js');
        },
        sourceFileName: function (file) {
          return file.originalPath;
        }
      },
      // Other custom preprocessors...
    }
  });
};

Current Tags

  • 8.0.1                                ...           latest (a year ago)
  • 8.0.0-beta.0                                ...           next (2 years ago)

14 Versions

  • 8.0.1                                ...           a year ago
  • 8.0.0                                ...           a year ago
  • 8.0.0-beta.0                                ...           2 years ago
  • 7.0.0                                ...           3 years ago
  • 6.0.1                                ...           5 years ago
  • 6.0.0                                ...           5 years ago
  • 5.2.2                                ...           5 years ago
  • 5.2.1                                ...           5 years ago
  • 5.2.0                                ...           5 years ago
  • 5.1.0                                ...           5 years ago
  • 5.0.1                                ...           5 years ago
  • 5.0.0                                ...           5 years ago
  • 4.0.1                                ...           5 years ago
  • 4.0.0                                ...           5 years ago
Downloads
Today 2
This Week 50
This Month 189
Last Day 48
Last Week 229
Last Month 1,484
Dependencies (0)
None
Dev Dependencies (8)
Dependents (87)

Copyright 2014 - 2017 © taobao.org |