Spinner не определен в Ladda с RequireJS

Question

Я пытаюсь разместить кнопку ladda на странице, созданной позвоночником, с require.js вместе с компонентами начальной загрузки. Тем не менее, я получил

"Uncaught ReferenceError: Spinner is not defined".

Я вырезал Минимизированный spin.js из оригинального ladda.js и поместить их в том же каталоге.

Shim'ed Ladda, как показано ниже:

require.config ({ 
    paths: { 
      //jquery, underscore, backbone here 
      spin : 'libs/ladda/spin', 
      ladda: 'libs/ladda/ladda' 
    }, 

    shim: { 
     ladda: { 
      deps: ['spin'], 
      exports: 'Ladda'  
    } 
} 
}); 

В связи магистральная:

define([ 
    'jquery', 
    'underscore', 
    'backbone', 
    'bootstrap', 
    'spin', 
    'ladda', 
], function($, _, Backbone, Bootstrap, Spinner, ladda){ 
    render: function() { 
     //templating 

     console.log ('Spinner: ' + typeof Spinner); 
     Ladda.create ($('button'));  
    } 
}); 

я мог видеть typeof Spinner функция. Свойство Spinner.name - «p». Должно ли Spinner.name быть «Spinner» вместо «p»? или «p» наследуется от измененной переменной?

Какие еще шаги я пропустил, чтобы сделать Spinner видимым в области ladda.js? Цените любые рекомендации.

спасибо.

Обновление: Благодаря советам Bass Jobsen, используйте hakimel совершенные spin.js, Spinner загружен, но ошибка по-прежнему сохраняется. Ниже Chrome Dev Tool консоли:

Answer 1

на основе github.com/hakimel/Ladda/pull/7 я переписал spin.js к классу, как сам Ladda. Я использовал define вместо require (http://bardevblog.wordpress.com/2013/01/05/re-learning-backbone-js-require-js-and-amd/). Теперь прядильщик тоже объект.

Ladda.bind() не работает (или я не понимаю, чего ожидать). Вы можете создать новый объект кнопки: Ladda.create();

См: http://plnkr.co/edit/DuIVFP0UP8sSoek9gEZc

//https://github.com/requirejs/example-jquery-cdn 
requirejs.config({ 
    //"baseUrl": "js/lib", 
    enforceDefine: true, 
    "paths": { 
     "app": "app", 
     "jquery": "//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min", 
     "spin": "spin", 
     "ladda": "ladda" 
    }, 
    shim: { 
     "spin": {exports: "Spinner"}, 
     "ladda": { 
      depends: "spin", 
      exports: "Ladda" 
     }, 



     } 
}); 

// Load the main app module to start the app 
requirejs(["app/main"]); 

приложение/main.js:

define(["jquery",'ladda','spin'], function($,ladda) { 
    //the jquery.alpha.js and jquery.beta.js plugins have been loaded. 
    $(function() { 
     console.log("$: " + typeof $); 
     console.log("ladda: " + typeof Ladda); 
     console.log("spin: " + typeof Spinner); 

     Ladda.bind($('button')[0]); //don't work ???????????? 
     //return; 
     //Ladda.create('.ladda-button'); 
     var l = Ladda.create($('button')[1]); 

    l.start(); 

// Will display a progress bar for 50% of the button width 
l.setProgress(5); 

// Stop loading 
l.stop(); 

// Toggle between loading/not loading states 
l.toggle(); 

// Check the current state 
l.isLoading(); 


    }); 
}); 

Answer 2

Не должна ли она быть с ladda с строчной l. Потому что это имя аргумента в вашей функции require.

ladda.create ($('button'));