optimizer-require
Plugin for the RaptorJS Optimizer that adds support for transporting Node.js-style modules to the browser.
Installation
This plugin is included as part of the optimizer
module so it is not necessary to use npm install
to add the module to your project. However, if you want to use a specific version of the optimizer-require
plugin then you can install it using the following command:
npm install optimizer-require --save
Usage
This plugin is enabled by default, but if you want to provide your own configuration then you can do that using code similar to the following:
The optimizer-require
plugin introduces two new dependency types that you can use to target Node.js modules for the browser. There usage is shown in the following optimizer.json
file:
These new dependency types are described in more detail below.
Dependency Types
require
The require
dependency type will wrap a Node.js module for delivery to the browser and allow it to be required from another module. For example:
Input modules:
foo.js:
exports { return a + b;}
bar.js:
var foo = ; exports { console;};
Output Bundles:
After running the following command:
optimizer require:./foo require:./bar --name test
The output written to static/test.js
will be the following:
$rmod;$rmod;
NOTE: $rmod
is a global introduced by the client-side Node.js module loader. It should never be used directly!. The code that declares $rmod
is not shown in the output above for brevity.
require-run
In the previous examples, neither the foo.js
or bar.js
module will actually run. The require-run
dependency type should be used to make a module self-executing. This is the equivalent of the entry point for your application when loaded in the browser.
Continuing with the previous example:
Input modules:
foo.js (see above)
bar.js (see above)
main.js:
;
Output Bundles:
After running the following command:
optimizer require-run:./main --name test
Alternatively:
optimizer --main main.js --name test
The output written to static/test.js
will be the following:
$rmod; $rmod; $rmod;
Conditional Remap
The optimizer-require
supports the package.json browser field for remapping a JavaScript module to a different module during client-side bundling. For example:
The optimizer-require
plugin also allows modules to be conditionally remapped based on the set of enabled flags by adding additional information an optimizer.json
in the same directory as a module. For example:
If the mobile
flag is set during optimization and the foo.js
module is required on the client (e.g., require('./foo')
) then the returned module will be the exports for foo-mobile.js
(not foo.js
).