gulp-modulify

gulp-modulify

gulp-modulify encapsulates each javascript source file inside an IIFE module and the whole inside an UMD module. The generated output is an UMD library that could run on both Node.js and the browsers.

Quick Startup

Write your source files with the import and export statements like this:

// IIFE_START
import A from '../a';

... your code

export default B;
// IIFE_END

gulp-modulify encapsulates your source file into an IIFE module if it finds the tags // IIFE_START and // IIFE_END. If you want to keep some portions of your code out of an IIFE module (not recommended), write it outside that tags.

It replaces import and export by links.

The resulting output looks like:

(function() {
  const A = $__TREE.src.x.y.a;

  ... your unaltered code

  $__TREE.extend($TREE.src.x.z, B);
}());

Then, it bundles all the files, of your project, in a unique output file. As each file is embedded in an IIFE module, it prevents any conflict between the different portions of your Javascript code.

The IIFE modules are connected together by the links that replace the import and export statements.

When you look at the resulting output, you can see that your code is almost not altered. gulp-modulify adds just two lines at the top of your library in addition to the links that replace import and export.

ES6libplus is a boilerplate that allows you writing libraries that rely on gulp-modulify.

How to use it

You can create a Gulp task like this:

function dolib() {
  return src(<source_files>)
    .pipe(modulify(output.js, {
      header,
      footer,
    }))
    .pipe(dest(destination));
}

This task takes an array of source files and pass them to modulify. This last one transforms the source files to a set of IIFE modules, bundles them, adds an header and a footer and creates an UMD library.

Again, ES6libplus is an example of library built with gulp-modulify. Feel free to use it.

License

MIT.

Changelog

0.0.2 (December 27, 2019)

• Fixed an issue on package.json,
  • Release.