systemjs-plugin-babel

WebJar for systemjs-plugin-babel

License

License

MIT
Categories

Categories

JavaScript Languages Github Development Tools Version Controls
GroupId

GroupId

org.webjars.npm
ArtifactId

ArtifactId

github-com-systemjs-plugin-babel
Last Version

Last Version

0.0.25
Release Date

Release Date

Type

Type

jar
Description

Description

systemjs-plugin-babel
WebJar for systemjs-plugin-babel
Project URL

Project URL

http://webjars.org
Source Code Management

Source Code Management

https://github.com/systemjs/plugin-babel

Download github-com-systemjs-plugin-babel

How to add to project

<!-- https://jarcasting.com/artifacts/org.webjars.npm/github-com-systemjs-plugin-babel/ -->
<dependency>
    <groupId>org.webjars.npm</groupId>
    <artifactId>github-com-systemjs-plugin-babel</artifactId>
    <version>0.0.25</version>
</dependency>
// https://jarcasting.com/artifacts/org.webjars.npm/github-com-systemjs-plugin-babel/
implementation 'org.webjars.npm:github-com-systemjs-plugin-babel:0.0.25'
// https://jarcasting.com/artifacts/org.webjars.npm/github-com-systemjs-plugin-babel/
implementation ("org.webjars.npm:github-com-systemjs-plugin-babel:0.0.25")
'org.webjars.npm:github-com-systemjs-plugin-babel:jar:0.0.25'
<dependency org="org.webjars.npm" name="github-com-systemjs-plugin-babel" rev="0.0.25">
  <artifact name="github-com-systemjs-plugin-babel" type="jar" />
</dependency>
@Grapes(
@Grab(group='org.webjars.npm', module='github-com-systemjs-plugin-babel', version='0.0.25')
)
libraryDependencies += "org.webjars.npm" % "github-com-systemjs-plugin-babel" % "0.0.25"
[org.webjars.npm/github-com-systemjs-plugin-babel "0.0.25"]

Dependencies

There are no dependencies for this project. It is a standalone project that does not depend on any other jars.

Project Modules

There are no modules declared in this project.

SystemJS Babel Plugin

Build Status

Provides Babel transpilation in the browser and in builds when using SystemJS 0.19.12+ and SystemJS Builder 0.15+.

Compatible with the automatic Rollup optimizations in SystemJS Builder.

Usage

SystemJS

The plugin can be used in SystemJS with the following configuration:

SystemJS.config({
  map: {
    'plugin-babel': 'path/to/systemjs-plugin-babel/plugin-babel.js',
    'systemjs-babel-build': 'path/to/systemjs-plugin-babel/systemjs-babel-browser.js'
  },
  transpiler: 'plugin-babel'
});

The plugin can also be configured as a loader through metadata in SystemJS.

jspm

This plugin is compatible with jspm 0.17 beta, but is not supported in jspm 0.16.

jspm install plugin-babel

Then set transpiler: 'plugin-babel' in the jspm.js config file.

Alternatively use jspm init -p to set up the plugin automatically.

ES Features

This repo comes with its own Babel build which includes all ES6 and Stage 2 and Stage 3 features by default, except for the ES6 library polyfills.

If ES6 polyfills are desired it is advisable to import core-js libraries manually as needed.

To use Stage 1 features, these need to be manually enabled via configuration:

SystemJS.config({
  meta: {
    '*.js': {
      babelOptions: {
        stage1: true
      }
    }
  }
});

If running in NodeJS or browsers that have ES2015 support, ES2015 feature transpilation can be disabled similarly:

SystemJS.config({
  meta: {
    '*.js': {
      babelOptions: {
        es2015: false
      }
    }
  }
});

This allows workflows that just support ES modules and stage proposal transforms.

React JSX

To use React with JSX support set:

SystemJS.config({
  meta: {
    '*.js': {
      babelOptions: {
        react: true
      }
    }
  }
});

Building and Bundling

Build support works with no further configuration through the standard jspm build and bundle commands.

To build with SystemJS builder manually, use the following build configuration:

builder.config({
  map: {
    'systemjs-babel-build': 'path/to/systemjs-plugin-babel/systemjs-babel-node.js'
  }
});
builder.bundle('app.js', 'out-bundle.js'); // create a named bundle
builder.buildStatic('app.js', 'out-static.js', { format: 'cjs' }); // create a static optimized build

When using builder.buildStatic, the ES module structure will be preserved and Rollup optimizations will included automatically allowing for static dead code removal.

Custom Presets and Transforms

Custom presets and transforms can be set via babelOptions config:

SystemJS.config({
  map: {
    'custom-preset': 'path/to/custom-preset.js',
    'custom-plugin': 'path/to/custom-plugin.js'
  },
  meta: {
    '*.js': {
      babelOptions: {
        presets: ['custom-preset'],
        plugins: ['custom-plugin']
      }
    }
  }
});

This way JSX support or other features can be included as needed (eg see http://jspm.io/0.17-beta-guide/installing-the-jsx-babel-plugin.html for jspm jsx support)

You can also pass options to Babel plugins the same way as in Node, without creating custom presets.

SystemJS.config({
  meta: {
    '*.js': {
      babelOptions: {
        plugins: [
          // best installed via jspm install npm:babel-plugin-transform-async-to-module-method
          ["babel-plugin-transform-async-to-module-method", {
            "module": "bluebird",
            "method": "coroutine"
          }]
        ]
      }
    }
  }
});

LICENSE

MIT

Versions

Version
0.0.25