Using RequireJS's optimizer with a single build file to produce multiple outputs

Question

I'm currently working on a big JavaScript project and I am using RequireJS to impose some structure.

I'd like to configure a build using the optimizer (r.js) so my project will be bundled in one minified file (for production purposes). This is fairly easy, however I have a couple of packages in my project and would like to have each package built to its own minified javascript file.

Example of the folder structure:

src/core/main.js
src/core/util/HashMap.js (
src/package1/main.js
src/package1/views/view1.js

Where the main.js files are the entry points for the modules.

I would like to configure my build in such a way that after the build is completed, I would have the following two outputs:

core.min.js
package1.min.js

However I can't seem to get this to work. Using the modules property of the build config doesn't seem to minify each module.

Can anyone shed a light on what I'm doing wrong here?

Answer 1

I had trouble getting Require.JS to do everything precisely the way I needed all by itself.

I am currently using Grunt for this. I have the Require.JS plugin for Grunt configured to combine a dozen module files into just 2 files. I do use modules, empty: and exclude here and there to help achieve this. Require.JS is still the best way to combine modules based on their dependencies.

Then I use the Uglify plugin for Grunt to separately minify the output.

While this might not help with your use-case, I'm also using Grunt's concat plugin to help get my output just the way I like it.

This is all in a Gruntfile.js and so all of this happens automatically with grunt watch whenever a file changes, making the develop-refresh-test loop just that bit nicer.