如何将jquery ui与requirejs一起使用

How do I use jquery ui with requirejs

本文关键字：requirejs 一起 ui jquery      更新时间：2023-09-26

我想在我的应用程序中使用jQuery UI的addClass函数。

除此之外，我使用的是普通的jQuery、下划线、主干，所有这些都与requirej分层在一起。

我配置了jQuery UI如下：

require.config({
    deps: ["main"],
    paths: {
        "text": "lib/text"
        , "jquery": "lib/jquery"
        , "jquery-ui": "lib/jquery-ui"
        , "underscore": "lib/underscore"
        , "backbone": "lib/backbone"
        , "bootstrap": "lib/bootstrap"
        , "templates": "../templates"
    },
    shim: {
        "jquery-ui": {
            exports: "$",
            deps: ['jquery']
        },
        "underscore": {
            exports: "_"
        },
        "backbone": {
            exports: "Backbone",
            deps: ["underscore", "jquery"]
        },
        "bootstrap": ['jquery']
    }
});

在我做的应用程序中：

define(['jquery', 'underscore', 'backbone'], function($, _, Backbone) {
    $('div').addClass('white');
});

不幸的是，这只是普通的addClass，而不是jQuery UI中的动画。

附言：我使用完整的jQuery版本。

您需要包含jquery ui:

define(['jquery-ui', 'backbone'], function() {
    $('div').addClass('white');
});

jquery应该是自动需要的，因为它是jquery ui 的依赖项

此外，这些脚本都没有返回任何内容，但它们的变量被分配给了窗口对象。无需分配。

尝试

define(['jquery', 'jquery-ui', 'underscore', 'backbone'], function($, ui, _, Backbone) {
    // $.ui should be defined, but do
    // $.ui = ui if its not
    $('div').addClass('white');
});

有时您只需要jQuery UI的一小段。例如，我最近需要sortable，但如果我试图加载整个东西，那么jquery ui上的$.button()和bootstrap中的$.button()之间就会发生冲突。jQuery UI现在支持AMD，所以我使用RequireJS的构建工具r.js来构建我需要的子集。

相关文章：