如何在requirejs下引用bootstrap

本來覺得只要require過來就能用

require(['jquery','underscore','bootstrap','cache'],function($,U,B,C){

但發現會報錯，相似未定義jQuery

緣由是在沒有requireJS框架以前，若是咱們想使用jquery框架，會在HTML頁面中經過<script>標籤加載，這個時候 jquery框架生成全局變量$和jQuery等全局變量。若是項目中引用了requireJS框架，採用模塊化的方式加載jquery，那麼 jquery不會再添加全局變量$和 jQuery 。如今問題來了，雖然jquery框架已經開始支持AMD規範，可是jquery的衆多插件仍是不支持AMD，仍然像之前同樣須要使用全局變量$

解決辦法很簡單 只須要配置requireJS的shim參數，來完成jquery插件的加載。

require.config({
            baseUrl:'js',
            paths:{
                jquery:'static/jquery-1.10.2.min',
                underscore:'static/underscore',
                bootstrap:'static/bootstrap'
            },
            shim:{
                'bootstrap':['jquery']
            },
            urlArgs: "bust=" +  (new Date()).getTime()
        })

完美解決。

固然 jquery ui 也相似

requirejs.config({
  shim: {
  'jquery.ui.core': ['jquery'],
  'jquery.ui.widget': ['jquery'],
  'jquery.ui.mouse': ['jquery'],
  'jquery.ui.slider':['jquery']
    },
  paths : {
    jquery : 'jquery-2.1.1/jquery',
    domReady : 'require-2.1.11/domReady',
    'jquery.ui.core' : 'jquery-ui-1.10.4/development-bundle/ui/jquery.ui.core',
    'jquery.ui.widget' : 'jquery-ui-1.10.4/development-bundle/ui/jquery.ui.widget',
    'jquery.ui.mouse' : 'jquery-ui-1.10.4/development-bundle/ui/jquery.ui.mouse',
    'jquery.ui.slider' : 'jquery-ui-1.10.4/development-bundle/ui/jquery.ui.slider'
  }
});


    
require([ 'jquery', 'domReady','jquery.ui.core','jquery.ui.widget','jquery.ui.mouse','jquery.ui.slider'],
    function($) {
      
      $("#slider" ).slider({
           value:0,
           min: 0,
           max: 4,
           step: 1,
           slide: function( event, ui ) {}       
      });        
                
    });