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 gulp-requirejs with all npm packages installed. Try it out:

var gulpRequirejs = require("gulp-requirejs")

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

gulp-requirejs v0.4.0

Builds projects using require.js's optimizer

#gulp-requirejs

gulp-requirejs on npm Dependency Status Build Status

Information

A small, simple, very easy wrapper around the require.js optimizer to work with gulp.js

Packagegulp-requirejs
Description uses require.js's r.js optimizer to combine require.js AMD modules into one file
Node Version ≧ 4

Installation

Simply add gulp-requirejs as a dev-dependency in your package.json or run

$ npm install --save-dev gulp-requirejs

Usage

Because the require.js optimizer (r.js) is a kind of build system in itself we can't use the gulp.src([...]) syntax at the moment (I might add this in future), instead this wrapper itself emits a pipable stream, holding a 'virtual' file, in which the result of the r.js build process are saved.

The resulting stream can be treated like a regular gulp.src(...) stream.

NOTE: The built in minification/obfuscation is deactivated by default. It is recommended to use a gulp plugin like gulp-uglify for minification, but you can enable r.js minification by setting the optimize option to uglify to minify using r.js.

var gulp = require('gulp'),
    rjs = require('gulp-requirejs');

gulp.task('requirejsBuild', function() {
    return rjs({
        baseUrl: 'path/to/your/base/file.js',
        out: 'FILENAME_TO_BE_OUTPUTTED',
        shim: {
            // standard require.js shim options
        },
        // ... more require.js options
    })
    .pipe(gulp.dest('./deploy/')); // pipe it to the output DIR
});

Note: In order to let gulp know that the optimization completes, return the rjs stream.

Error handling

gulp-requirejs will emit errors when you don't pass an options object and if the baseUrl or out properties are undefined.

The require.js optimizer itself might also emit errors; unfortunately there's no way of catching them elegantly at the moment.

Source maps

When source maps are enabled via the r.js generateSourceMaps option the stream returned by rjs() contains an additional file named the same as the out option with .map appended.

Use gulp-sourcemaps to use this file in your gulp configuration:

var gulp = require('gulp'),
    rjs = require('gulp-requirejs')
    sourcemaps = require('gulp-sourcemaps');

gulp.task('requirejsBuild', function() {
    return rjs({
        baseUrl: 'path/to/your/base/file.js',
        out: 'FILENAME_TO_BE_OUTPUTTED',
        generateSourceMaps: true,
        shim: {
            // standard require.js shim options
        },
        // ... more require.js options
    })
    .pipe(sourcemaps.init({loadMaps: true})) // initialize gulp-sourcemaps with the existing map
    .pipe(sourcemaps.write()) // write the source maps
    .pipe(gulp.dest('./deploy/')); // pipe it to the output DIR
});

Options

The options object supports the same parameters as the require.js optimizer.

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