requirejs включает несколько расширений для управления jquery

Question

Как загрузить другие расширения для элемента управления jquery под названием «fancytree». Я пытаюсь загрузить fancytee или включить fancytree.table.js и другие расширения, которые необходимы - ниже моя конфигурация

require.config({ 

    shim: { 

     underscore: { 
      exports: '_' 
     }, 
     backbone: { 
      deps: [ 
       'underscore', 
       'jquery' 
      ], 
      exports: 'Backbone' 
     }, 
     'jquery-ui': { 
      exports: "$", 
      deps: ['jquery'] 
     }, 
     'fancytree': { 
      deps: ['jquery-ui'] 
     }, 
     'alertify': { 
      deps: ['jquery'] 
     }, 
     'fancytreetable': { 
      deps: ['jquery', 'fancytree'] 
     } 
    }, 

    paths: { 
     'jquery': '../lib/jquery/jquery', 
     'underscore': '../lib/underscore/underscore', 
     'backbone': '../lib/backbone/backbone',  
     'text': '../lib/text/text', 
     'jquery-ui': '../vendor/jquery-ui/jquery-ui', 
     'fancytree': [  
      '../vendor/fancytree/fancytree', 
      '../vendor/fancytree/fancytree.table'/* this extension here needs to be added but it's not included */ 
     ],   
     'alertify': '../vendor/alertify/alertify'  
    }, 

    baseUrl: '/js/app', 

}); 

Answer 1

Nikhil Mehta's comment указывает на то, что вы в правильном направлении. Значение paths для fancytree неверно. Вы используете массив там, когда хотите предоставить резервные значения для модулей. Если вы дадите [A, B, C], например, если A не загружается, RequireJS пытается B, и если это не удается, попробуйте C. И если все сбой, то это отказ нагрузки.

на основе конфигурации вы показываете, вам нужно:

fancytree: '../vendor/fancytree/fancytree', 
fancytreetable: '../vendor/fancytree/fancytree.table' 

У вас уже есть shim, который устанавливает, что fancytreetable потребности fancytree.

Обратите внимание, что если вы используете довольно старые версии поддеревьев и опорных линий, вам не нужно указывать значения shim. RequireJS, вероятно, будет просто игнорировать их, но это может смутить людей, читающих ваш код.

Answer 2

Вот как он работает, требует от jquery.fancytree-all и последних jquery-ui с поддержкой AMD, поскольку для работы с отдельными расширениями потребуется много обрезки.

onBuildWrite не является обязательным, но я предпочитаю это таким образом

варианты

requirejs.config({ 
    paths: { 
    'jquery': './js/vendor/jquery', 
    'jquery-ui': './js/vendor/jquery-ui', 
    'jquery.fancytree': './js/vendor/fancytree/jquery.fancytree-all' 
    }, 
    shim: { 
    'jquery.fancytree': { 
     deps: ['jquery', 'jquery-ui/core', 'jquery-ui/effect', 'jquery-ui/effects/effect-blind', 'jquery-ui/widgets/draggable', 'jquery-ui/widgets/droppable'], 
     exports: 'jQuery.fn.fancytree' 
    } 
    }, 
    onBuildWrite: function (moduleName, path, contents) { 
    'use strict'; 
    if (moduleName === 'jquery.fancytree') { 
     contents = 'define("jquery.fancytree", ["jquery", "jquery-ui/core", "jquery-ui/effect", "jquery-ui/effects/effect-blind", "jquery-ui/widgets/draggable", "jquery-ui/widgets/droppable"], function(jQuery) { ' + contents + '});'; 
    } 
    return contents; 
    } 
}); 

// usage 
define([ 
    'jquery', 
    'jquery.fancytree', 
    'css!./css/fancytree/skin-custom/ui.fancytree.css', 
    ], 
    function($) { 
    'use strict'; 
    // 
    $('#tree').fancytree({ 
     checkbox: true, 
     source: [{title: 'Node 1'}, {title: 'Node 2',key: 'id2'}] 
    }); 
    // 
    }); 
//