RequireJS +骨干+ jQuery的通过`script`使用jQuery干扰通过装装RequireJS [英] RequireJS + Backbone + jQuery loaded through `script` interfering with jQuery loaded through RequireJS

问题描述

我只是想升级到1.1.2骨干，并一直与jQuery的问题。

I just tried upgrading to Backbone 1.1.2, and have been having issues with jQuery.

在默认情况下，骨干希望找到了jQuery的基本目录为 ./的jquery.js 。当我加入这个到RequireJS路径，并把它添加到垫片为骨干的依赖，那么一切里面的工作要求，但外面，没有任何工程。这是因为如果在本地参考我创建跺脚是在全球范围内包括jQuery的？

By default, Backbone expects to find the jQuery in the base directory as ./jquery.js. When I add this into the RequireJS path and add it to the shim as a dependency for Backbone, then everything works inside of require, but outside, nothing works. It's as if the local reference I am creating is stomping over the globally included jQuery?

在我的html页面，我有这样的：

In my html page, I have this:

<script src="js/lib/jquery/2.0.2/jquery.min.js"></script>
<script src="js/lib/jqueryui/{$jquery.ui.version}/jquery-ui.min.js"></script>
<script data-main="js/homepage" src="js/lib/require/2.1.11/require.min.js"></script>

homepage.js （目前的工作）是这样的：

homepage.js (which currently works) looks like this:

require.config({
    baseUrl: "./js",
    paths: {
    Underscore: 'lib/underscore/1.6.0/underscore-min',
    Backbone: 'lib/backbone/1.0.0/backbone-min'
    // ,jquery: 'lib/jquery/2.0.2/jquery.min'
    // ,jqueryui: 'lib/jqueryui/1.10.3/jquery-ui.min'

},

shim: {
    // 'jqueryui': {
    //  deps: ['jquery'],
    //  exports: "$"
    // },
    'Underscore': {
        // deps: ['jquery'],
        exports: "_"
    },
    'Backbone': {
        deps: ['Underscore', /*'jquery'*/],
        exports: 'Backbone'
    }

}

});

require([ 'views/homepage/main' ], function(Main) {

});

在这种情况下，我使用的是全球jQuery和它完美的作品，无论是内部应用程序，并在全球为其使用jQuery我的网站导航。该JS还与 r.js 完美minifies。

In this situation, I am using the global jQuery and it works perfectly, both inside the app, and globally for my site navigation which uses jQuery. The js also minifies perfectly with r.js.

但是，当我改变我的BB版本1.1.2，它说，它无法找到的jquery.js 。当我取消所有行的 homepage.js 来包括jQuery的依赖关系，使一切都在应用程序中，但现在我的导航休息，说我已经创建了jQuery函数是不确定的。我也无法来缩小我的应用程序在 r.js 。

But when I change my BB version to 1.1.2, it says that it can't find jquery.js. When I uncomment all of the lines in homepage.js to include jQuery dependencies, everything renders within the application, but now my navigation breaks, saying that the jQuery functions that i have created are undefined. I am also unable to minify my app in r.js.

这使我相信，的jQuery 和 $ 全局命名空间正在被践踏时RequireJS开始下载上它的依赖。这只是需要使用 $的一个经典案例。noConflict ？如果是这样，我怎么修改我的code做到这一点？

This leads me to believe that jQuery and $ in the global namespace are being stomped on when RequireJS starts downloading its dependencies. Is this just a classic case of needing to use $.noConflict? If so, how do I modify my code to do this?

推荐答案

答案最初是为骨干1.1.2，和旧版本的下划线。

Update for more recent versions

The answer was originally written for Backbone 1.1.2, and an older version of Underscore.

最近的版本是AMD-知道，不需要垫片为他们设置。你也应该全部使用小写名字的模块：骨干和下划线因为有些名字是很难$ C $光盘。 （您可以解决的硬编码以地图的配置，但它只是简单的使用标准，全部小写的名字。）

Recent versions are AMD-aware and do not need shim set for them. You should also use all lowercase names for the modules: backbone and underscore because some of these names are hardcoded. (You can work around the hardcoding with a map config but it is just simpler to use the standard, all lowercase names.)

如果您加载的jQuery与＆LT;脚本＆GT; 标记，然后将其加载在RequireJS，你必须采取特殊的precautions。不过，我不，表明你的需要注意到你的问题什么的有文件中加载两个jQueries。所以，你可以使用下面的技巧使用jQuery的同一实例内外AMD模块：

If you load jQuery with a <script> tag and then load it in RequireJS you have to take special precautions. However, I do not notice anything in your question that indicates that you need to have two jQueries loaded. So you could use the following trick to use the same instance of jQuery outside and inside AMD modules:

define('jquery', [], function () {
    return jQuery;
});

require.config({
    baseUrl: "./js",
    paths: {
        Underscore: 'lib/underscore/1.6.0/underscore-min',
        Backbone: 'lib/backbone/1.1.2/backbone-min'
    },

    shim: {
        Underscore: {
             exports: "_"
        }
    }

});

require([ 'views/homepage/main' ], function(Main) {

});

此方式，当RequireJS负荷的的jQuery 模块，它会执行code传递到定义上方。我记得，jQuery UI的只是自己安装一个jQuery插件，所以你不需要做什么特别的了。此外，我建议使用1.1​​.2骨干，这并不需要一个垫片。下划线不依赖于jQuery的所以它的垫片不需要为它的依赖。

This way when RequireJS "loads" the jquery module, it'll execute the code passed to the define above. As I recall, jQuery UI just installs itself as a jQuery plugin so you don't need to do anything special about it. Also I recommend using Backbone 1.1.2, which does not need a shim. Underscore does not depend on jQuery so the shim for it does not need a dependency for it.

这篇关于RequireJS +骨干+ jQuery的通过`script`使用jQuery干扰通过装装RequireJS的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！