Настройка require.js для backbone-ui

Question

Я пытаюсь использовать библиотеку backbone-ui, но не могу определить конфигурацию require.js, чтобы загрузить модули.

main.js:

requirejs.config({ 
    baseUrl: '/static/js/facebook_report_app/js', 

    paths: { 
     backbone: 'lib/backbone' 
    , underscore: 'lib/underscore' 
    , jquery: 'lib/jquery' 
    , laconic: 'lib/laconic' 
    , moment: 'lib/moment' 
    , backboneUI: 'lib/backbone-ui/js/backbone_ui' 
    , menuUI: 'lib/backbone-ui/js/menu' 
    , textUI: 'lib/backbone-ui/js/text_field' 
    , text: 'lib/text' 
    }, 

    shim: { 
    'lib/underscore': { 
     exports: '_' 
    }, 
    'laconic': { 
     deps: ["jquery"], 
     exports: "$.el" 
    }, 
    'lib/backbone': { 
     deps: ['lib/underscore'] 
    , exports: 'Backbone' 
    }, 
    'backboneUI': { 
     deps: ['lib/backbone', 'laconic', 'jquery'] 
    , exports: 'Backbone.UI' 
    }, 
    'textUI': { 
     deps: ['jquery', 'lib/backbone', 'backboneUI', 'laconic'] 
    , exports: 'Backbone.UI.TextField' 
    }, 
    'menuUI': { 
     deps: ['lib/backbone', 'backboneUI', 'laconic', 'textUI'] 
    , exports: 'Backbone.UI.Menu' 
    }, 
    'lib/backgrid': { 
     deps: ['lib/underscore', 'lib/backbone'] 
    , exports: 'Backgrid' 
    }, 
    'report_app': { 
     deps: ['lib/underscore', 'lib/backbone', 'lib/backgrid', 'backboneUI'] 
    } 
    } 
}); 

require([ 
    'facebook_report_app' 
], 

function(FacebookReportApp) { 
    window.fbReport = new FacebookReportApp(); 
}); 

menu_user.js

define(['jquery', 'lib/backbone', 'backboneUI', 'menuUI', 'laconic'], function(AccountPickerView) { 
    var AccountPickerView = Backbone.UI.Menu.extend({ 
    el: '.left-nav', 
    });  

    return AccountPickerView; 
}); 

Когда я загрузить это в разработчике, отчеты консоли "Объект [объект Object] имеют никакого метода 'ввода'", на строка 44 текстового_файла.js библиотеки Back-Bone-UI.

Я предполагаю, что мой подход к настройке разбит для начала - я добавил файлы menu.js и text_field.js bc. Я получал ошибки «Backbone.UI.Menu» и Backbone.UI.TextField '(требование Меню) не были определены. Но должен быть более чистый способ принести различные файлы позвоночника-ui.

Так как я могу избавиться от ошибки ввода «no method input»? Или лучше настроить использование базового интерфейса? Или я должен использовать jQuery UI в первую очередь? В каком случае, куда мне пойти, чтобы определить конфигурацию этого?

Answer 1

Я получил это работает, после того, как много возился со следующей установкой:

JS/main.js

requirejs.config({ 
    baseURL: 'js', 
    urlArgs: "bust=" + (new Date()).getTime(), 
    shim: { 
     underscore: { 
      exports: '_' 
     }, 
     jquery: { 
      exports: '$' 
     }, 
     backbone: { 
      deps: ['underscore', 'jquery'], 
      exports: 'Backbone' 
     }, 
     laconic: { 
      exports: '$.el' 
     }, 
     backbone_ui: { 
      deps: ['underscore', 'jquery', 'backbone', 'laconic', 'moment'], 
      exports: 'Backbone.UI' 
     } 
    }, 
    paths: { 
     jquery: 'http://cdnjs.cloudflare.com/ajax/libs/jquery/2.0.3/jquery.min', 
     moment: './lib/moment.min', 
     laconic: './lib/laconic', 
     underscore: 'http://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.4.4/underscore-min', 
     backbone: 'http://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.0.0/backbone-min', 
     backbone_ui: './lib/backbone-ui', 
     crypto: 'http://crypto-js.googlecode.com/svn/tags/3.1.2/build/rollups/md5', 
     templates: '../templates', 
     collections: './collections', 
     models: './models', 
     } 
    }); 

JS/просмотров/json.js

define(['jquery','underscore', 'backbone', 'backbone_ui'], 
function($,_,Backbone, BBUI){ 
    var JsonView = Backbone.View.extend({ 
     className: "json-item", 
     initialize: function(data){ 
      var self = this; 
      this.app = data.app; 
      this.model = data.model; 
      this.listenTo(this.model, "change", function(){ 
      console.log("model changed", self.model); 
      }); 
      this.model.fetch({ 
       success: function(){ 
        self.render(); 
       } 
      }); 
     }, 
     render: function(){ 
      var self = this; 
      $(this.el).empty(); 
      for (key in this.model.attributes){ 
       this.el.appendChild(new Backbone.UI.Label({content:key}).render().el); 
       this.el.appendChild(new Backbone.UI.TextField({model: this.model, content:key}).render().el); 
      } 
      this.el.appendChild(new Backbone.UI.Button({content:"save", onClick: function(){self.model.save()}}).render().el); 
      return this; 
      } 
    }); 

    return JsonView; 
}); 

Пожалуйста, обратите внимание, что Я импортирую backbone-ui как BBUI и никогда не ссылаюсь на него таким образом. BBUI.TextField() - это определенная функция, и ее использование будет работать, но способ настройки Backbone-ui делает изменения в Backbone, JQuery и Underscore при загрузке. Поэтому я решил, что мне просто нужно, чтобы он был запущен до того, как просмотр загрузился.