Question

我在我的html中加载了包含jQuery的require.js：

<script data-main="requires" src="lib/require-jquery.js"></script>

my requires.js的内容：

require.config( {
      paths: {
            "jquery.mobile": "lib/jquery.mobile",
            "jquery.mobile.router": "lib/jquery.mobile.router"

      },
      shim: {
            "jquery.mobile" : {
                "exports": "$.mobile"
            },
            "jquery.mobile.router": {
                  "deps": [ "jquery.mobile" ],
                  "exports": "$.mobile.Router"
            }

      }

} );

require(["jquery.mobile.router" ], function() {
    require(["router"]);
} );

在我的router.js中，我创建了jquery mobile router plugin的新实例：

router = new $.mobile.Router(...);

这给了我这个错误：

未捕获的TypeError：undefined不是函数

当我输出$和$ .mobile时，它们都被定义，只是$ .mobile.Router未定义。

我在这里做错了什么？

Answer 1

我的问题是我添加了jquery.mobile作为jquery.mobile.router的依赖项，因此将首先加载jQuery mobile，其中路由器的文档说明了这一点：

必须在jQuery Mobile之前加载jQuery Mobile路由器javascript文件。

这是我改变我的requires.js以解决问题的方法：

require.config( {

    paths: {
        "jquery.mobile": "lib/jquery.mobile",
        "jquery.mobile.router": "lib/jquery.mobile.router"
    },

    shim: {
        "router": {
            "deps" : ["jquery.mobile"]
        },
        "jquery.mobile" : {
            "deps" : [ "jquery.mobile.router"],
            "exports": "$.mobile" 
        },

        "jquery.mobile.router": {
          "exports": "$.mobile.Router"
        }
    }
});

require(["router"]);

现在我只需要我的router.js并加载jquery.mobile和jquery.mobile.router作为依赖项。现在加载订单是这样的：

jquery.mobile.router
jquery.mobile
路由器

Answer 2

在router.js文件中尝试此操作： -

define(["jquery", "jquery.mobile.router"], function($) {
    // your js code in router.js
} );

通过在define调用中指定jquery并传入$作为参数，$中定义的jquery对象jquery.mobile.router和相关函数现在可用于代码范围（完整地包含在文件router.js中）。

使用jQueryMobile-Router的Require.js

2 个答案: