Gulp-traceur-compiler NPM

gulp-traceur-compiler

The plugin uses modified files from Traceur which are used in its command line utility. In short the reason this is required is that when outputting to single file the methods exposed in the NodeCompiler are not currently sufficient.

Hence this plugin takes the output tree then compiles and finally adds to the file's contents from Buffer.

The above is for the benefit of those that might wish to extend this plugin further.

Install

$ npm install --save-dev gulp-traceur-compiler

Usage

The module only takes two options. An object containing any Traceur compiler options and two an optional boolean to indicate single file output.

By default traceur module option is set to modules=commonjs.

Options

- object (or boolean for single file using defaults) containing Traceur options see below link.

- boolean when true output is to single file using gulp.dist as your last pipe.

Traceur Options for Compiling

Basic

var gulp = require('gulp');
var traceur = require('gulp-traceur-compiler');

gulp.task('bundle', function () {
	return gulp.src('./src/app.js')
		.pipe(traceur())
		.pipe(gulp.dest('./dist'));
});

Output Single File

This single file example is equivalent to the below Traceur command when using the command line tool.

$ traceur --out app-build.js app.js

Passing true (note: this was previously an output path, still backward compatible) will compile to single file using commonjs.

If you wish to use a different modules configuration you'd pass in an object containing your configurations along with any other features you may wish enabled or disabled.

{ modules: 'amd' }

var gulp = require('gulp');
var traceur = require('gulp-traceur-compiler');
var dist = './dist';

gulp.task('bundle', function () {
	return gulp.src('./src/app.js')
		.pipe(traceur(true)) 
  // or .pipe(traceur({ modules: 'amd', annotations: true }, true)
		.pipe(gulp.dest(./dist));
});

Prefixing Module Name

In some cases when NOT outputting to single file you may need to prefix a module name for your production modules. The following will do just that.

{ prefix: 'core' }

This would result in a module that looks like the below:

System.register('core/module_name', [// dependencies], function () { // the execute action for module. })

NOTE: in some cases you may only need to set "moduleName: true". When prefix option is used this is automatically set.

{ moduleName: true // or '+' or  some string value }

Generating Source Maps

var gulp = require('gulp');
var sourcemaps = require('gulp-sourcemaps');
var traceur = require('gulp-traceur-compiler');

gulp.task('default', function () {
	return gulp.src('./src/app.js')
		.pipe(sourcemaps.init())
		.pipe(traceur())
		.pipe(sourcemaps.write(./))
		.pipe(gulp.dest('./dist'));
});

For source map options see: gulp-sourcemaps