Failed to load routed module requirejs? durandal bug?

Question

I created an Asp.Net MVC and used nuget to add HotTowel (V2.0.1 of 9/11/2013). I created a couple of ViewModel, Models. However, I got the following error.

"Failed to load routed module (viewmodels/myVM). Details: Load timeout for modules: durandal/plugins/router\nhttp://requirejs.org/docs/errors.html#timeout"

Is it the problem of durandal/plugins/router? Or it can be caused by some code I added?

The error occurred at Scripts/durandal/system.js.

var logError = function(error) {
    if(error instanceof Error){
        throw error;
    }

    throw new Error(error);
};

The following is the VM code.

define(['services/datacontext', 'durandal/plugins/router', 'services/logger'],
// Remove the durandal/plugins/router and the functions will get rid of the error.
function (datacontext, router, logger) {
    var title = 'Event';
    var vm = {
        activate: activate,
        deactivate: deactivate,
        refresh: refresh,
        events: events,
        title: title
    };

    return vm;

    //#region Internal Methods
    var events = ko.observableArray();

    function activate() {
        logger.log(title + ' View Activated', null, title, true);
        return datacontext.getEventPartials(events);
    }

    var deactivate = function () {
        events([]);
    };

    var refresh = function () {
        return datacontext.getEventPartials(events, true);
    };

    //#endregion
});

The following is the call stack

logError [system.js] Line 92    Script
Anonymous function [router.js] Line 359 Script
[External Code] 
Anonymous function [system.js] Line 260 Script
[External Code] 
[Async Call]    
    ....

Code at router.js,

        isProcessing(true);
        router.activeInstruction(instruction);

        if (canReuseCurrentActivation(instruction)) {
            ensureActivation(activator.create(), currentActivation, instruction);
        } else {
            system.acquire(instruction.config.moduleId).then(function(module) {
                var instance = system.resolveObject(module);
                ensureActivation(activeItem, instance, instruction);
            }).fail(function(err){
                    system.error('Failed to load routed module (' + instruction.config.moduleId + '). Details: ' + err.message);
                });
        }
    }

And previous one in system.js.

    acquire: function() {
        var modules,
            first = arguments[0],
            arrayRequest = false;

        if(system.isArray(first)){
            modules = first;
            arrayRequest = true;
        }else{
            modules = slice.call(arguments, 0);
        }

        return this.defer(function(dfd) {
            require(modules, function() {
                var args = arguments;
                setTimeout(function() {
                    if(args.length > 1 || arrayRequest){
                        dfd.resolve(slice.call(args, 0));
                    }else{
                        dfd.resolve(args[0]);
                    }
                }, 1);
            }, function(err){
                dfd.reject(err);
            });
        }).promise();
    },

How does require.config.paths looks like? Typically the path to router is plugins/router in 2.0.x. In addition move all vars defined below return vm above var vm ={..., otherwise the won't be defined before usage. — RainerAtSpirit
The require.config in main.js is require.config({ paths: { 'text': '../Scripts/text', 'durandal': '../Scripts/durandal', 'plugins': '../Scripts/durandal/plugins', 'transitions': '../Scripts/durandal/transitions' } }); — ca9163d9
Try replacing 'durandal/plugins/router' with 'plugins/router' in the VM code. — RainerAtSpirit
Great. It works after remove durandal/ from the require parameter. Thanks very much. — ca9163d9

RainerAtSpirit RainerAtSpirit · Accepted Answer · 2013-11-28T10:16:32

Based on the comments I'd recommend to modify the vm code slightly, so that all variables that are returned via vm are defined before use. In addition 'plugins/router' is used instead of 'durandal/plugins/router'.

define(['services/datacontext', 'plugins/router', 'services/logger'],
// Remove the durandal/plugins/router and the functions will get rid of the error.
function (datacontext, router, logger) {
    var title = 'Event';
    var events = ko.observableArray();
    var deactivate = function () {
        events([]);
    };
    var refresh = function () {
        return datacontext.getEventPartials(events, true);
    };

    var vm = {
        activate: activate,
        deactivate: deactivate,
        refresh: refresh,
        events: events,
        title: title
    };

    return vm;

    //#region Internal Methods
    function activate() {
        logger.log(title + ' View Activated', null, title, true);
        return datacontext.getEventPartials(events);
    }
    //#endregion
});

BTW the name Internals methods is misleading as everything in that region is returned via vm. I prefer to work with named function instead, which get created before the return statement if they are returned and place them below the return statement in a Internal methods region if they are not returned.

define(['services/datacontext', 'plugins/router', 'services/logger'], 
function( datacontext, router, logger ) {
    var title = 'Event';
    var events = ko.observableArray();

    function deactivate () {
        events([]);
    }

    function refresh () {
        return datacontext.getEventPartials(events, true);
    }

    function activate () {
        logger.log(title + ' View Activated', null, title, true);
        return datacontext.getEventPartials(events);
    }

    return {
        activate: activate,
        deactivate: deactivate,
        refresh: refresh,
        events: events,
        title: title
    };

    //#region Internal Methods

    //#endregion
});

Failed to load routed module requirejs? durandal bug?

1 Answers