Как включить jQueryUI в мое модульное приложение backbone.js с помощью RequireJS?

Я хочу включить jQueryUI в мое приложение backbone.js, используя RequireJS. Файл main.js, включенный в мой index.html, выглядит следующим образом:

require.config({
    paths: {
            jquery: 'libs/jquery/jquery-1.7.2.min',
            jqueryui: 'libs/jquery/jquery-ui-1.8.18.custom.min',
            underscore: 'libs/underscore/underscore-min',
            backbone: 'libs/backbone/backbone-optamd3-min',
            text: 'libs/require/text',
            templates: 'templates'
       }

});

require(['app'], function(App){
    App.start();
});

И для каждого файла model/view/router я просто включаю пространство имен "jquery" в начале блока "define" следующим образом:

define([
    'jquery',
    'underscore',
    'backbone',
    'views/categoryview',
    'text!templates/category.html'
    ], function($, _, Backbone, CategoryView, categoryTemplate){
        // Here comes my code
});

Но jQueryUI не может использоваться в этих файлах. Что-то не так с моим кодом? Или я должен также включить "jqueryui" в каждый блок "define" ? Но если я включу "jqueryui" в блок "define" , как мне назвать его в функции, чтобы избежать конфликта имен с jquery?

Ответы

Ответ 1

Вы можете включить все файлы, которые только патят какой-либо другой объект (например, jQuery UI) в ваш основной файл следующим образом (вам нужно убедиться, что jQuery загружен перед jQuery UI):

require(['jquery', 'app', 'jqueryui'], function ($, App) { App.start(); });

Другим подходом является включение jQuery UI в каждый модуль, как вы уже упоминали.

Я лично предпочитаю первый подход, даже если он скрывает зависимости.

Ответ 2

В то время как ответ kujakettu хотя бы частично прав, мне также пришлось указать jQuery как зависимость в моей прокладке, чтобы убедиться, что jQuery был загружен перед jQuery-UI.

например.

require.config({
    baseUrl: 'scripts/modules',
    paths:{
        jquery:'../libs/jquery',
        jqueryUI:"../libs/jquery-ui",
        underscore:'../libs/underscore',
        backbone:'../libs/backbone'
    },
    shim: {
        jqueryUI: {
            deps: ['jquery']
        },
        underscore: {
            exports: '_'
        },
        backbone: {
            deps: ["underscore", "jquery"],
            exports: "Backbone"
        },
        waitSeconds: 15
    }
});

Ответ 3

Довольно старый пост. Там инструмент доступен для преобразования jquery ui файлов в версию AMD, созданной jrburke. Надеюсь, это было бы полезно!

Ответ 4

Другие ответы немного устарели. Пользовательский интерфейс JQuery поставляется с поддержкой AMD. Если вы хотите, чтобы весь проект просто использовал bower install jquery-ui, а затем добавил его к путям. Никакой прокладки не требуется.

Если вы хотите загрузить подмножество пользовательского интерфейса jQuery, которое вам нужно в вашем приложении (при этом не загружайте лишнюю раздутость), просто используйте bower install jquery-ui, чтобы получить все, а затем используйте инструмент сборки RequireJS, называемый r.js, чтобы создать AMD пакет именно тех файлов, которые вам нужны.