javascript ライブラリお試し用 テンプレ(requireJS)

無数に存在するjavascriptライブラリをお手軽に試したい

問題

試すライブラリ自体がいろいろなライブラリに依存しているので、毎回準備してパスを通すのが面倒

解法

1. 一度使用した事のあるライブラリは、使いたいと思った瞬間に使えるように辞書化する
2. 依存ライブラリの取り込み作業が減るように、それらを出来る限りCDNで読み込めるようにする

---

その結果

require_def.js

(function(){
    'use strict';

    requirejs.config({
        urlArgs : "nocache=" + new Date().getTime(),    //nocache
        shim: {
            'jquery.ascensor': ['jquery']
           ,'jquery.easing': ['jquery']
           ,'jquery.scrollTo': ['jquery']
           ,'jquery.tmpl': ['jquery']
           ,'jquery.splmenu': ['jquery']
           ,'jquery.pnotify':['jquery']
           ,'jquery.bottom':['jquery']
           ,'underscore':{
                exports:"_"
           },'backbone':{
               deps:["underscore","jquery"]
               ,exports: 'Backbone'
           }
        },
        baseUrl : '/javascripts',
        paths : {
            'jquery.splmenu' : 'libs/plugins/jqsimplemenu'
            ,'jquery.ascensor' : 'libs/plugins/jquery.ascensor'
            ,'jquery.pnotify' : 'libs/pnotify-1.2.0/jquery.pnotify.min'
            ,'jquery.bottom' : 'libs/jquery.bottom' 
            //CDN
            ,'jquery' : '//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min'
            ,'jquery.tmpl' : '//ajax.aspnetcdn.com/ajax/jquery.templates/beta1/jquery.tmpl.min'
            ,'jquery.easing' : '//cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js'
            ,'underscore' : '//cdnjs.cloudflare.com/ajax/libs/underscore.js/1.3.3/underscore-min'
            ,'backbone' : '//cdnjs.cloudflare.com/ajax/libs/backbone.js/0.9.2/backbone-min'
            ,'mdn' : '//cdnjs.cloudflare.com/ajax/libs/modernizr/2.6.2/modernizr.min.js'
        }
    });    
    require_use();  //callback
})();

---

で、呼び出し側

test.html

    function require_use(){
       require(['jquery.bottom','underscore'],loadFinish);
    }

    function loadFinish(){
        //use require lib
    }

新たに試したいライブラリはrequire_def.jsに追加して
使うと、個人的な感触ですが、後々楽になってきた気がしてます。

あと、http://cdnjs.cloudflare.com 便利です。