Sign Up for Free

RunKit +

Try any Node.js package right in your browser

This is a playground to test code. It runs a full Node.js environment and already has all of npm’s 400,000 packages pre-installed, including babel-compile with all npm packages installed. Try it out:

var babelCompile = require("babel-compile")

This service is provided by RunKit and is not affiliated with npm, Inc or the package authors.

babel-compile v2.0.0

A script to compile .js and .jsx to es6 with Babel using babel-core, that actually works!

babel-compile

While putting static babel-compiling in place, we've discovered that the babel cli client is not perfectly suited to our usage. We can only compile by directory one at a time, we have to wrap our babel invocations in an rm -rf out/ to make sure that only files we expect to exist do. Instead of trying to fix the upstream cli client, we've decided to use the really simple babel-core API to do our compiling ourselves.

The result is a babel cli client which does things the way we want:

  • Automatically generate source maps with correct file references
  • Cleans output directory
  • Allows us to load configuration from an NPM module instead of copying around a .babelrc

Getting started

First, you're going to want to install this package

npm install babel-compile --save-dev
npm install babel-preset-es2015 --save-dev

Next, you're going to want to add it to your package.json file's scripts section.

Assuming that you store your code in src/ and your tests in test/ and you want them to respectively end up in lib/ and .test/, you could add the following to your package.json:

...
"scripts": {
  "compile": "babel-compile -p es2015 src:lib test:.test",
  "pretest": "npm run compile",
  "prepublish": "npm run compile"
}
...

Whenever you run npm test or npm publish, you will also have your code compiled automatically. If you want to test your code, you can run npm run compile to get a compiled copy.

Tests

Mocha has a built in hook for comping code with babel as its imported. We don't use this hook anymore as it could work around bugs correctly in tests that aren't worked around in a deployed set of code. An example of problem code is the Array.prototype shim methods like .include.

When importing code from a babel-compiled library in your tests, ensure that you

require('../lib/file');

to include the compiled copy for the program.

As well, your package.json file's test script should use, as an example, .test/*_test.js instead of test/*_test.js

Source Maps (why do I have awful stack traces)

If you're using Node 0.12, you're likely noticing that your stack traces are terrible. This is because the Node 0.12 environment doesn't support source maps natively. If you'd like to have useful stacktraces, you can do this:

npm install source-map-support

and then, in your non-library js-code, add

require('source-map-support').install();

to get nice stacks with real line numbers. More details here: https://github.com/evanw/node-source-map-support

RunKit is a free, in-browser JavaScript dev environment for prototyping Node.js code, with every npm package installed. Sign up to share your code.
Sign Up for Free