RequireJS không hoạt động với các plugin jQuery của Shim'ed

Question

Các plugin hầu như luôn nhấn mạnh vào việc tải trước jQuery. Và họ không nên làm điều này do tôi sử dụng thiết lập shim.

Trong main.js của tôi có các thiết lập này:

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 
}); 

Sau đó trong tập tin này, tôi có như sau:

// 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 
    }); 

}); 

Nhưng tôi nhận được lỗi này tất cả các thời gian:

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

Và tôi có thể thấy trong tab Mạng Chrome của tôi rằng nó được tải trước jQuery.

Bây giờ tôi đã thử thêm enforceDefine: true sau khi nhìn quanh đây trên stackoverflow, nhưng không có may mắn. Tôi đã thử di chuyển requirejs.config vào trang html của mình. Và tôi đã thử tải jQuery từ một tệp cục bộ. Tất cả đều không có may mắn.

Tôi đang thiếu gì?

Answer 1

Cậu Shim jquery quá?

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

Answer 2

Hãy thử:

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

Answer 3

Không phải là $ bạn muốn xuất?

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

Answer 4

Chỉ cần đảm bảo bạn nạp jQuery trước plugin của bạn, sử dụng định nghĩa:

// 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 
    }); 
    }); 

});