需要js不加载模块

时间:2013-01-21 17:37:26

标签: backbone.js requirejs single-page-application

我一直盯着这一段时间似乎无法弄清楚为什么有些AMD在将它们作为依赖项加载后无法使用。我有一个名为“模型”的自定义模块;在我的MVC项目中使用虚拟路径“/scripts/models.js”配置的捆绑包。当我在require.config中定义它并作为依赖项时,它会加载该文件。我可以看到它被请求并找到了。没有错误来自要求。但是,当我尝试将其作为加载的依赖关系参数传递到我的路由器时,它是未定义的(models.userModel)。

我在这里做错了吗?我没有看到任何循环依赖,我尝试通过给它命名来定义模块模块。无论我是全局定义还是在router.js文件中按路径请求模块,都是未定义的。

app.js。主配置。 (下同)

require.config({
    baseUrl: "/scripts/app",
    paths: {
        jquery: "../jquery",
        underscore: "libs/underscore",
        backbone: "libs/backbone",
        kendo: "libs/kendo",
        models: "../models"
    },
    // We shim Backbone since it doesn't declare an AMD module
    shim: {
        underscore: {
            exports: "_"
        },
        backbone: {
            deps: ["underscore", "jquery"],
            exports: "Backbone"
        }
    },
});

require([
    "jquery",
    "backbone",
    "kendo",
    "models",
    "router"
], function ($, backbone, kendo, models, router) {  
    alert("config-start");
});

user.js的。夹在models.js包中。 (下同)

define({
    userModel : kendo.observable({
        datasource: kendo.data.DataSource({
            transport: {
                read: {
                    url: "/api/usersettings",
                    dataType: "json",
                    type: "GET"
                },
                update: {
                    url: "/api/usersettings",
                    dataType: "json",
                    type: "PUT"
                }
            },
            schema: {
                model: {
                    id: "UserId"
                }
            },
            parameterMap: function (options, operation) {
                if (operation !== "read" && options.models) {
                    return {
                        models: kendo.stringify(options.models)
                    };
                }
                return options;
            }
        }),
        save: function () {
            this.data.sync();
        },
    })
});

router.js文件(下)

define(["jquery",
    "backbone",
    "models"
], function ($, backbone, models) {

    /**
     * The Router class contains all the routes within the application -
     * i.e. URLs and the actions that will be taken as a result.
     *
     * @type {Router}
     */

    var Router = Backbone.Router.extend({
        contentArea: $("#MainContent"),
        routes: {
            "user/usersettings/contact": "contact",
            "user/usersettings/security": "security",
            "user/usersettings/dashboard": "dashboard",
            "user/usersettings/permissions": "permissions",
            "user/usersettings/colors": "colors"
        },
        contact: function () {
            var contactTemplate = kendo.template($("#usersettings-usercontact").html());
            this.contentArea.empty();
            this.contentArea.html(contactTemplate);

            kendo.bind(this.contentArea, models.userModel); // models is undefined
        },
        security: function () {

        },
        dashboard: function () {

        },
        permissions: function () {

        },
        colors: function () {

        }
    });

    // Create a router instance
    var router = new Router();

    //Begin routing
    Backbone.history.start();

    return router;
});

也许我错过了一些明显的东西,但我无法将“模型”作为外部依赖加载。从router.js引用时未定义。关于“联系”功能。

1 个答案:

答案 0 :(得分:1)

定义需要一个将返回一个值的函数,然后在另一个模块中需要时注入该值。

Source code comment:

/**
 * The function that handles definitions of modules. Differs from
 * require() in that a string for the module should be the first argument,
 * and the function to execute after dependencies are loaded should
 * return a value to define the module corresponding to the first argument's
 * name.
 */
define(function(){
  return {
    userModel: ...
  }
})