Howto use stub_js_modules to prevent bloating your bundles?


Continuing the discussion from Anybody using mockup patterns? Expect huge bloat if only a couple of us will do!:

Can somebody elaborate on how to use the stub_modules, please?

  • How are they specified using generic setups registry.xml?
  • In case of production (precompiling with grunt) how does the compile process get notice of that stub_modules are used?

Let's assume we have a production bundle containing a mockup pattern that depends on jquery (or any other resource already included in the "plone bundle"):
Bundle spezification:

  'jquery',  // Is alread present in the Plone bundle

Pattern definition:

    'jquery', // here we require jquery 
    ], function (Base, Registry, $, Datatables, DatatablesEditable) {
    'use strict';

These specifications will cause jquery to be compiled into the bundle.
And here comes the final question: How to use stub_modules to prevent the jquery to be compiled into the bundle?

Any help appreciated


Here is how it is done in plone core:

You can also add in stub modules through the resource registry control panel in the bundle settings.

As long as you are using the plone-compile-resources, it'll read what is in the bundle settings and use it appropriately. If you have your own custom Gruntfile, then you can stub out modules like this for instance

Hi Nathan!

Thank you so much for the valuable pointers! I will implement it as once!


    baseUrl: 'src/plone/app/mosaic/browser/static/js',
    name: 'mosaic.pattern',
    out: 'src/plone/app/mosaic/browser/static/plone-mosaic.js',
    optimize: 'uglify2',
    generateSourceMaps: true,
    preserveLicenseComments: false,
    paths: {
        'jquery': 'empty:',        <---   like this ?
        'tinymce': 'empty:',
        'underscore': 'empty:',
        'pat-logger': 'empty:',
        'pat-registry': 'empty:',
        'mockup-patterns-base': 'empty:',
        'mockup-patterns-modal': 'empty:',
        'mockup-patterns-tinymce': 'empty:',
        'mockup-utils': 'empty:',
        'mosaic-url': ''

Doing so (setting jquery to empty in my config.js file) I'm rewarded with:

Running "requirejs:inqbus_mailcenter" (requirejs) task

Error: ENOENT, no such file or directory
In module tree:
Warning: RequireJS failed. Use --force to continue.

Aborted due to warnings.
Makefile:50: recipe for target 'bundle' failed
make: *** [bundle] Error 6

Or did I get you wrong?


Did you use empty or empty:? Looks like you used the former when you need the later.

Ah! Need new glasses!

Thank you again Nathan, your my daysaver.