当前位置: 首页 > 面试题库 >

使用RequireJS加载主干和下划线

松旻
2023-03-14
问题内容

我正在尝试使用RequireJS加载Backbone和Underscore(以及jQuery)。使用最新版本的Backbone和Underscore,似乎有些棘手。例如,Underscore自动将自身注册为模块,但Backbone假定Underscore在全球范围内可用。我还应该注意,Backbone似乎并没有将自己注册为模块,这使其与其他库有些不一致。这是我能想到的最好的main.js:

require(
{
    paths: {
        'backbone': 'libs/backbone/backbone-require',
        'templates': '../templates'
    }
},
[
    // jQuery registers itself as a module.
    'http://cdnjs.cloudflare.com/ajax/libs/jquery/1.7/jquery.min.js',

    // Underscore registers itself as a module.
    'http://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.2.1/underscore-min.js'
], function() {

    // These nested require() calls are just due to how Backbone is built.  Underscore basically says if require()
    // is available then it will automatically register an "underscore" module, but it won't register underscore
    // as a global "_".  However, Backbone expects Underscore to be a global variable.  To make this work, we require
    // the Underscore module after it's been defined from within Underscore and set it as a global variable for
    // Backbone's sake.  Hopefully Backbone will soon be able to use the Underscore module directly instead of
    // assuming it's global.
    require(['underscore'], function(_) {
        window._ = _;
    });

    require([
        'order!http://cdnjs.cloudflare.com/ajax/libs/backbone.js/0.5.3/backbone-min.js',
        'order!app'
    ], function(a, app) {
        app.initialize();
    })
});

我应该提到的是,尽管它起作用了,但优化器对此却感到窒息。我收到以下信息:

Tracing dependencies for: main
js: "/home/httpd/aahardy/requirejs/r.js", line 7619: exception from uncaught JavaScript throw: Error: Error: Error evaluating module "undefined" at location "/home/httpd/aahardy/phoenix/trunk/ui/js/../../ui-build/js/underscore.js":
JavaException: java.io.FileNotFoundException: /home/httpd/aahardy/phoenix/trunk/ui/js/../../ui-build/js/underscore.js (No such file or directory)
fileName:/home/httpd/aahardy/phoenix/trunk/ui/js/../../ui-build/js/underscore.js
lineNumber: undefined
http://requirejs.org/docs/errors.html#defineerror
In module tree:
    main

有没有更好的方法来解决这个问题?谢谢!


问题答案:

现在,RequireJS2.X使用新shim配置可以更好地有机解决非AMD模块,例如Backbone&Underscore 。

shim配置易于使用:(1)声明依赖项(deps)(如果有)(可能来自paths配置,也可能是有效路径本身)。(2)(可选)从要填充的文件中指定全局变量名称,该名称应导出到需要它的模块函数中。(如果不指定导出,则只需使用全局变量,因为任何内容都不会传递到您的require/ define函数中。)

这是shim加载Backbone 的简单示例用法。即使没有任何依赖性,它也会为下划线添加导出。

require.config({
  shim: {
    underscore: {
      exports: '_'
    },
    backbone: {
      deps: ["underscore", "jquery"],
      exports: "Backbone"
    }
  }
});

//the "main" function to bootstrap your code
require(['jquery', 'underscore', 'backbone'], function ($, _, Backbone) {   // or, you could use these deps in a separate module using define

});

注意: 此简化的代码假定jquery,bone和underscore位于与此“ main”代码相同的目录下的名为“ jquery.js”,“
backbone.js”和“ underscore.js”的文件中(这将成为require的baseURL )。如果不是这种情况,则需要使用path
config。

我个人认为,使用内置shim功能,不使用分叉版本的Backbone&Underscore的优势要胜过使用另一个流行答案中推荐的AMD叉的优势,但是无论哪种方式都能奏效。



 类似资料:
  • 最新版本 require.js 2.1.16 下载压缩版 下载未压缩版 你在浏览器中使用所需要的功能。 r.js: Optimizer and Node/Rhino/Nashorn/xpcshell adapter 下载 r.js 可以让你进行优化并能够在 Node, Rhino , Nashorn或者 xpcshell 中运行. 如果你正在运行在 Node,并且希望使用NPM通过NPM安装文件,

  • 我对RequireJS非常陌生,在编写QUnit到源代码时遇到了困难,源代码具有使用RequireJS动态加载模块的逻辑。 下面是源代码:factory/Factory.js * 运行 QUnit 时,模块“page/something”永远不会加载,并且永远不会调用回调。我在这里错过了什么吗?感谢您的回复。 **QUnit工厂/FactoryTests.js* *test-require-con

  • 问题内容: 感谢Dan Wahlin的精彩文章,我设法实现了Angular的控制器和服务的延迟加载。但是,似乎没有一种干净的方法来懒惰加载独立的模块。 为了更好地解释我的问题,假设我有一个没有RequireJS的应用,其结构如下: 这是在Plunker中带有RequireJS的示例应用程序:http ://plnkr.co/aiarzVpMJchYPjFRrkwn 问题的核心是Angular不允许

  • 问题内容: 我想保留一个JSON文档来存储一些简单的数据,并且我需要此文档并在调用中使用JSON对象,以便可以使用它。这不是电话。我的意思是应该用于开发,但我确实希望在构建时编译文件,这与API 的实际调用不同,API的内容是动态的。 问题答案: 最简单的方法是为此使用requirejs json插件,这将使您也可以将文件包括在构建中。 https://github.com/millermedei

  • 本文向大家介绍使用RequireJS库加载JavaScript模块的实例教程,包括了使用RequireJS库加载JavaScript模块的实例教程的使用技巧和注意事项,需要的朋友参考一下 js通过script标签的默认加载方式是同步的,即第一个script标签内的js加载完成后,才开始加载第二个,以此类推,直至js文件全部加载完毕。且js的依赖关系必须通过script的顺序才能确保;而在js加载期

  • 本文向大家介绍Python3中_(下划线)和__(双下划线)的用途和区别,包括了Python3中_(下划线)和__(双下划线)的用途和区别的使用技巧和注意事项,需要的朋友参考一下 在看一些Python开源代码时,经常会看到以下划线或者双下划线开头的方法或者属性,到底它们有什么作用,又有什么样的区别呢?今天我们来总结一下(注:下文中的代码在Python3下测试通过) _ 的含义 在python的类中