I am using require js to load google analytics. In config I have

requirejs.config({ "paths": { "ga": "//www.google-analytics/analytics", ...

And I have a module that depends on ga that initialises analytics.

Everything works fine until someone uses a browser plugin that blocks google analytics. When that happens, the resulting javascript error breaks everything.

• failed to load resource : blocked by clien
• uncaught error: script error for: ga

How can I tell requirejs not to have a fit if a certain module fails to load? How can you make a module optional?

Thanks.

I am using require js to load google analytics. In config I have

requirejs.config({ "paths": { "ga": "//www.google-analytics./analytics", ...

And I have a module that depends on ga that initialises analytics.

Everything works fine until someone uses a browser plugin that blocks google analytics. When that happens, the resulting javascript error breaks everything.

• failed to load resource : blocked by clien
• uncaught error: script error for: ga

How can I tell requirejs not to have a fit if a certain module fails to load? How can you make a module optional?

Thanks.

• javascript
• google-analytics
• requirejs

4 Answers 4

require takes a 3rd argument which is an error callback, so you can assign window.ga to a function which always returns undefined. This avoids errors when calling google analytics functions elsewhere in your code.

require(['ga'], function(data) {
  window.ga('create', 'UA-XXXXXXXX-X');
  window.ga('send', 'pageview');
}, function() {
  window.ga = function(){};
});

You could require the module within your own module code but outside of the module definiton requirements, but this does mean you can't quite as easily chain on dependencies you need. i.e.

define([ /* Normal dependencies here ... */], function() {

    try {
        require(['ga']);
    } catch (error) {
        // Handle lack of GA if needed
    }

};

Alternatively you'd have to write your own module wrapper which synchronously blocks as it attempts the above, then returns GA if it was successful, or null otherwise.

I found the best way is to use the array notation for path definitions. This way you can define the external URL for the module, and a local fallback, in your requirejs path configuration. No need for additional try/catch blocks or module-specific error handling.

Documentation link: http://requirejs/docs/api.html#pathsfallbacks

I defined a module named noop which defines an empty function, and then set up my paths like this:

requirejs.config({ "paths": { "ga": [ "//www.google-analytics./analytics", "util/noop" ], ...

The best solution, It works for me.

Open lib/mage/requirejs/resolver.js file.

   /**
     * Checks if provided module has unresolved dependencies.
     *
     * @param {Object} module - Module to be checked.
     * @returns {Boolean}
     */
    function isPending(module) {
        return !!module.depCount;
    }

Replace with this bellow code:

    /**
     * Checks if provided module is rejected during load.
     *
     * @param {Object} module - Module to be checked.
     * @return {Boolean}
     */
    function isRejected(module) {
        return registry[module.id] && (registry[module.id].inited || registry[module.id].error);
    }

    /**
     * Checks if provided module has unresolved dependencies.
     *
     * @param {Object} module - Module to be checked.
     * @returns {Boolean}
     */
    function isPending(module) {
        if (!module.depCount) {
            return false;
        }

        return module.depCount > _.filter(module.depMaps, isRejected).length;
    }

Thanks