1

模块加载器有什么用？它如何在 JQuery 中使用？如何使用 require.js 作为模块加载器。也请分享示例应用程序。如果你有！！

4

1 回答 1

9

好的，我分部分去

什么是模块加载器？

好的，在 Js 中你不能使用导入指令（在节点中是的，你可以。）所以很多人将他们的代码放在一起（甚至他们使用的库），所以他们不必加载任何东西，但这会带来很大js 文件并为您的应用程序添加加载时间，其他人认为他们将代码分开并使用标签分段加载，但这是不切实际的，因为您必须维护 html 页面中的所有定义，所以这里有 require.js并通过创建模块并按需加载来帮助您解耦代码。这使您可以轻松地分离代码，并使小块更易于修复、维护或添加功能。

来自 require.js 文档

“当项目达到一定规模时，管理项目的脚本模块开始变得棘手。您需要确保以正确的顺序对脚本进行排序，并且您需要开始认真考虑将脚本组合成一个包部署，以便只发出一个或极少数请求来加载脚本。”

它如何在 JQuery 中使用？

我会将问题更改为如何与 JQuery 一起使用？

您将在需要时将 Jquery 作为依赖项加载，这里有一个基本示例

如何使用 require.js 作为模块加载器？

这里有一小段代码

html需要它

  <!DOCTYPE html>
  <html>
    <head>
          <title>jQuery+RequireJS Sample Page</title>
        <script data-main="scripts/main" src="scripts/require-jquery.js"></script>
      </head>
      <body>
          <h1>jQuery+RequireJS Sample Page</h1>
     </body>
    </html>

我们的 main.js

require(["jquery", "jquery.alpha", "jquery.beta"], function($) {
    //the jquery.alpha.js and jquery.beta.js plugins have been loaded.
    $(function() {
        $('body').alpha().beta();
    });
});

配置的一部分

paths: {
        "jquery": "require-jquery"
    },

    modules: [
        {
            name: "main",
            exclude: ["jquery"]
        }

我希望这可以帮助你。您可以在此处下载示例项目

我将添加我的应用程序示例，以便您了解如何使用 Backbone 和 require

配置

require.config({
    shim: {
      'underscore': {
        deps: ['jquery'], //dependencies
        exports: '_' //the exported symbol
      },
      backbone: {
        deps: ['underscore', 'jquery'],
        exports: 'Backbone'
      }
    }

    paths: {
      jquery: 'libs/jquery/jquery-1.7.1.min',
      underscore: 'libs/underscore/underscore-min',
      backbone: 'libs/backbone/backbone-min',

    }

  });

一个示例模块

define(['jquery', 'underscore', 'backbone'], function($, _, Backbone) {
    //Your code Here
  });

享受与 require 一起工作的乐趣 :-)

于 2012-07-13T15:58:15.857 回答