JSFiddleで外部jsライブラリを読み込む
開眼! JavaScript ―言語仕様から学ぶJavaScriptの本質
- 作者: Cody Lindley,和田祐一郎
- 出版社/メーカー: オライリージャパン
- 発売日: 2013/06/19
- メディア: 単行本（ソフトカバー）
- この商品を含むブログを見る
これまで、JSは対応が必要になったら使う程度で、じっくり学習したことがなかったので、 書籍で少しずつ勉強している。
JSFiddle
まず、この便利な実行環境のサービスをを知らなかった。 詳しくは 以下で。
Underscore.js
書籍の中でUnderscore.jsが紹介されている。
underscore.js または、圧縮された underscore-min.js を読み込んで利用する。
この説明も外部リソースに譲る。
http://dotinstall.com/lessons/basic_underscorejsdotinstall.com
JSFiddleで外部jsライブラリを読み込む
正当なやり方は、JSFiddleの画面左側にある"External Resources"から行う。
ここをクリックするとフォームが現れるので、ライブラリのURIを入力して+マークを押せば設定完了だ。
適切なCDNを利用する
外部ライブラリURIとして、https://raw.githubusercontent.com/jashkenas/underscore/master/underscore-min.js のような、github上のrawファイルを指定してはいけない。
Refused to execute script from 'https://raw.githubusercontent.com/jashkenas/underscore/master/underscore-min.js' because its MIME type ('text/plain') is not executable, and strict MIME type checking is enabled.
githubはCDNではないというアラートが表示される。実際、 MINEタイプが 'text/plain' となり、jsのライブラリとして実行することができない。
単純に動作を確認したいのであれば、cdnjsでホストされているURIを指定したり、
RawGitというサービスで、githubから変換されたURIを得ることができるので、これを指定する。
上記サービスは、本番環境での利用は非推奨なので、そいう場合は自前でCDNを用意しなければいけない。
追記：Google Hosted Libraries
jQuery等、有名なライブラリはGoogleがホストしているので、ここから読み込むのが良さそうだ。
参考情報
githubのjavascriptやcssをrawgit使ってCDN経由ぽく読み込んで使ってみるテスト for jsfiddle - tweeeetyのぶろぐ的めも
