require.js-未定义的模块作为参数传递以定义回调

require.js - undefined modules passed as arguments to define callback

本文关键字:参数传递 定义 回调 js- 未定义 模块 require      更新时间:2023-09-26

我的应用程序需要以下js设置:

app.js

require.config({
    paths: {
        jquery: '../thirdparty/jquery-1.9.1.min',
        moment: '../thirdparty/moment',
        spinningwheel: '../thirdparty/datepicker/spinningwheel',
        handlebars: '../thirdparty/handlebars',
        colorgenerator: '../usercolors',
        baseconfig: '../config'        },
    shim: {
        'baseconfig': [],
        'spinningwheel': {
            deps: [],
            exports: 'SpinningWheel'
        },
        'handlebars': {
            deps: [],
            exports: 'Handlebars'
        }
    }
});

require(['jquery', 'dom', 'helpers', 'actions', 'history', 'store'], function ($, dom, helpers, actions, hist, store) {
    //all good on the home front at this point
    //all modules loaded properly
    history.render();
})

history.js

define(['renderview'], function (renderview) {
    //all good here, render view is loaded properly
    return {
        render: function () {
            renderview({...});
        }
    };
})

renderview.js

define(['jquery', 'helpers', 'dom'], function ($, helpers, dom) {
    function renderView(view) {
        var template = helpers.getTemplate(); //ERROR: helpers is undefined!
    }
    return renderView;
});

helpers.js

define(['jquery', 'handlebars', 'history', 'dom', 'colorgenerator'], function ($, Handlebars, history, dom, ColorGenerator) {
    var helpers = {};
    helpers.getTemplate = function () {
       //do stuff
    };
    return helpers;
});

因此,正如您所看到的,helpers在inital app.js回调中加载得很好,但当我进入renderview.js时,它是未定义的。示例中的依赖数组正是我实际代码中的内容,但是我已经编辑了所有看起来不相关的代码。你知道为什么在app.js中可以很好地加载助手而在renderview.js中不能加载吗?这是循环依赖关系吗?在我看来不是这样,但我今天可能已经做得太久了:)

感谢您的帮助或建议!

添加当前解决方案,尽管我不知道为什么需要这样做:)

define(['require', 'jquery', 'dom'], function (require, $, dom) {
    function renderView() {
        //responsible for rendering our view
        var helpers = require('helpers');
        var history = require('history');
        var v = history.get();
        ...
        tmpl = helpers.getTemplate(v.template);
        ...
    }
    return renderView;
});

因此,如果不在回调内部执行require,而不是将它们指定为依赖项,我就无法正确加载这些模块。我很想了解为什么会这样…

考虑到问题和您的解决方案,您的需求调用中似乎有一个循环依赖项。也许您在helper模块中需要的一些模块也需要helpers模块。