Question

请考虑以下页面：

<html>
<head>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>
</head>
<body>
    <script data-main="app" src="require.js"></script>
</body>
</html>

如果没有加载RequireJS，我如何使用jQuery作为RequireJS模块的依赖项？我知道jQuery exposes itself是一个全局的AMD模块，所以我应该能够将它添加为依赖项，但我不太清楚如何。

我希望能够做到以下几点：

require(['jquery'], function() {
    console.log('success')
});

如果jQuery尚未完成加载，它应该等待它完成，然后继续。这可能吗？

Answer 1

首先加载jQuery，然后加载RequireJS。两个都加载后运行主模块。

<html>
<head>
    <script src="require.js"></script>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>
</head>
<body>
    <script>
        require(["app"], function(app){
            app.runMe()
        })
    </script>
</body>
</html>

如果jQuery看不到define.amd，那么jQuery不会将自己注册为AMD模块。使其正确注册的唯一方法是在jQuery之前加载RequireJS。

Answer 2

您应该将jquery定义为垫片，如下所示：

requirejs.config({
  shim: {
    'jquery': {
        exports: '$'
    }
  },
  path : {
    jquery : '$PATH/jquery.js'
  }
});

Answer 3

一种方法是使用data-main属性加载带有require.js的main.js文件：

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

其中main.js文件的风格为：

requirejs.config({
    shim: {         // regard the shim structure as a dependency map
        'jquery': [],
        'app': ['jquery']    // app code will not execute before jquery is loaded
    },
    waitSeconds: 20
});

require(
    [
        'jquery',
        'app'
    ],
    function(
        $
    ) {
        //the plugins from the dependency array have been loaded.
        console.log ("jQuery and app loaded through require.js");
    }
);

上面的示例假设您从require.js（也就是您的网站）所在的位置加载jquery.js

使用jQuery作为依赖，而无需使用RequireJS加载jQuery？

3 个答案: