2012-12-18 14 views
7

Wtyczki prawie zawsze wymagają ładowania przed jQuery. I nie powinni tego robić ze względu na moje użycie ustawienia podkładki.RequireJS nie działa z wtyczkami jQuery Shim'ed

W moich main.js mam te ustawienia:

requirejs.config({ 
    paths: { 
     'jquery': 'https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min', 
     'bootstrap': '../bootstrap/js/bootstrap.min', 
     'select2': 'vendor/select2', 
     'jshashtable': 'vendor/jshashtable-2.1', 
     'jquery.numberformatter': 'vendor/jquery.numberformatter-1.2.3.min', 
     'jq-datepicker': 'vendor/bootstrap-datepicker', 
     'jq-datepicker.da': 'vendor/bootstrap-datepicker.da' 
    }, 

    // Use shim for plugins that does not support ADM 
    shim: { 
     'bootstrap': ['jquery'], 
     'select2': ['jquery'], 
     'jq-datepicker': ['jquery'], 
     'jshashtable': ['jquery'], 
     'jquery.numberformatter': ['jquery', 'jshashtable'] 
    }, 
    enforceDefine: true 
}); 

Później w tym pliku mam następujący:

// Start the main app logic. 
requirejs(['jquery', 'bootstrap', 'jq-datepicker'], 
function ($) { 

    console.log('Require.JS loaded'); 

    // Init datepickers 
    // Docs: https://github.com/eternicode/bootstrap-datepicker 
    $('.datepicker').datepicker({ 
     format: 'dd/mm/yyyy', 
     language: 'da', 
     keyboardNavigation: false, 
     autoclose: true 
    }); 

}); 

Ale ten błąd cały czas:

Uncaught TypeError: undefined is not a function bootstrap.min.js:6 
(anonymous function) bootstrap.min.js:6 
(anonymous function) 

Na karcie Chrome Network widzę, że jest ona załadowana przed wersją jQuery.

Teraz próbowałem dodać enforceDefine: true po obejrzeniu tutaj na stackoverflow, ale bez powodzenia. Próbowałem przenieść requirejs.config na moją stronę html. Próbowałem też załadować jQuery z lokalnego pliku. Wszystko bez szczęścia.

Czego mi brakuje?

+0

Przetestowałem swój przykład i nie widać żadnych problemów: http://jsfiddle.net/asgoth/tHkHw/Usunąłem plik enforceDefine i jq-datepicker.da (nie mogłem go znaleźć) – asgoth

Odpowiedz

5

Czy pasowana jQuery zbyt?

shim: { 
    jQuery: { 
     exports: 'jquery' 
    }, 
    'bootstrap': { 
     exports : 'jquery' 
    }, 
    'select2': { 
     exports :'jquery' 
    }, 
    ... 
}, 
+0

Tak, próbowałem tego, ale bez powodzenia w W tej chwili po prostu ładuję jQuery poza RequireJS –

+1

bootstrap: { deps: ['jQuery'], eksportów: "jQuery" }, –

+0

Naprawiłem ten problem, ale jakiś czas temu. Dostajesz akceptację, ponieważ w większości przypadków byłaby to prawda. A ty masz najbardziej upvotes. –

1

Spróbuj:

shim: { 
    'bootstrap': { 
     exports : 'jquery' 
    }, 
    'select2': { 
     exports :'jquery' 
    }, 
    ... 
}, 
+0

Próbowałem już tego, nie działałam :( –

+0

To też nie działało dla mnie :( –

2

Czy to nie $ chcesz wyeksportować?

shim: { 
     'jquery': { 
      exports: '$' 
     }, 
     'jqueryuitouchpunch': { 
      deps: ['jqueryui'] 
     }, 
} 
0

Wystarczy upewnić się załadować jQuery przed wtyczki korzystając określić:

// Start the main app logic. 
requirejs(['jquery', 'bootstrap'], function ($) { 
    define(['jq-datepicker'], function() { 
     $('.datepicker').datepicker({ 
      format: 'dd/mm/yyyy', 
      language: 'da', 
      keyboardNavigation: false, 
      autoclose: true 
    }); 
    }); 

});