javascript - 在 Require.js 中使用多个版本的 jQuery

标签 javascript jquery requirejs

我有一种情况,我必须在同一页面上运行两个版本的 jQuery(基本上,有一个运行 1.4.2 的网站,我有一个运行需要 1.8.2 的脚本的小书签,我知道这不是一个好主意,但我现在坚持使用它)。

现有版本为1.4.2合一,需要更新的版本为1.8.2。

我正在使用 require.js 并且看到了一个帖子 in this question here但不太明白什么是最好的方法:

在我的例子中,我有一个模块 main.js:

(function () {
var root = this;

require.config({
    baseUrl: "http://localhost:9185/scripts/app/"      
});

define3rdPartyModules();
loadPluginsAndBoot();

function define3rdPartyModules() {
    define('jquery', [], function () { return root.jQuery.noConflict(true); });              
    define('ko', [], function () { return root.ko; });       
}

function loadPluginsAndBoot() {      
    requirejs([], boot);
}

function boot() {        
    require(['bootStrapper'], function (bs) { bs.run(); });
}
})();

然后是一些看起来与此类似的其他模块:

define('bootStrapper', ['jquery', 'presenter', 'repository', 'dataPrimer'],
function ($, presenter, repository, dataPrimer) {
    //some stuff here

我是 requirejs 的新手,我在使用 1.4.2 版加载 main.js 之前加载它,如下所示:

 $.getScript("http://localhost:9185/bundles/jsextlibs?v=GOyDBs-sBDxGR5AV4_K-m-   OK9DoE0LGrun5FMPyCO9M1", function () {     
    $.getScript("http://localhost:9185/Scripts/lib/require.js", function () {        
        $.getScript("http://localhost:9185/bundles/jsapplibs?v=9TJUN0_624zWYZKwRjap4691P170My5FUUmi8_fzagM1");
        $.getScript("http://localhost:9185/Scripts/main.js");
    });
});

谁能告诉我如何修改我的代码,以便我的所有模块都能够使用 1.8.2 版本,而不会干扰已经在 1.4.2 上运行的代码。

谢谢

戴维

最佳答案

var reqOne = require.config({
context: "version1",
baseUrl: 'scripts/',
paths: {
    jquery: 'lib/jquery.min',
}
});

var reqTwo = require.config({
    context: "version2",
    baseUrl: 'scripts/',
    paths: {
        jquery: 'lib/jquery.modern',
    }
});

reqOne(["helper/util"], function(require,util) {
        //This function is called when scripts/helper/util.js is loaded.
            //If util.js calls define(), then this function is not fired until
                //util's dependencies have loaded, and the util argument will hold
                    //the module value for "helper/util".
//                    intheutil(); //This was done
                    console.log('util loaded');
});


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

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


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

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

console.log('If no errors mean success!');

以上是我在 main.js 中使用的。有关完整的实现细节,请参阅我在 github 中的实现。 github.com .

这里jquery.min是jquery版本1.x jquery.modern 是 jquery 版本 2.x

我用过console.log。因此,请检查启用了浏览器控制台的示例。以上答案基于 Require.js 的文档。所以我认为这一定是您的案例的解决方案。

这是我的引用资料。 Require.js .

关于javascript - 在 Require.js 中使用多个版本的 jQuery,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13935588/

相关文章:

javascript - 如何在 React 中使用 useState Hook 更改/添加数组某行的值

jquery - 无法使用 fancybox 显示 PDF

javascript - 想要在弹出窗口中显示日历?

Javascript:移动浏览器窗口时检测

javascript - 如何在新窗口中打开链接?

javascript - 网站上的 JQuery 和 Prototype 冲突

Javascript 休眠 x 秒

css - 带有 r.js 优化器的多个 css 模块?

javascript - 文件保护程序和 requireJS : Mismatched anonymous define

javascript - 如果 jQuery 符合 AMD 标准,为什么它会创建全局变量 $?