javascript - 带有 jQ​​ueryMobile-Router 的 Require.js

Question

我在我的 html 中加载了带有 jQ​​uery 的 require.js:

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

我的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(...);

这给了我这个错误:

Uncaught TypeError: undefined is not a function

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

我做错了什么？

Answer 1

我的问题是我将 jquery.mobile 添加为 jquery.mobile.router 的依赖项，因此将首先加载 jQuery mobile，路由器的文档指出:

The jQuery Mobile router javascript file must be loaded before jQuery Mobile.

这就是我更改 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 作为依赖项。现在加载顺序是这样的:

1. jquery.mobile.router
2. jquery.mobile
3. 路由器