RaveJSとは
JavaScriptのモジュールローダーです。
似たライブラリにRequireJSがありますが、RaveJSはNode.jsやBowerのパッケージ情報から依存関係を解決してくれます。
標準ではAMD、node.js、ES6のモジュールに対応しており、拡張により、CSS、テンプレート、JSON、JSX等を読み込むことも可能です。
Note: JavaScriptのモジュール化 AMDとrequire.js
Try
まずはbower.jsonを用意してください。
bower initを使うと楽。
例:
{
name: 'myapp',
version: '0.0.0',
main: 'myapp.js'
}
次にRaveJSをダウンロード。
bower install rave.js --save
index.htmlはとりあえず↓な感じでRaveJSを読み込むだけ。
<!doctype html>
<html data-rave-meta="bower.json">
<head>
<meta charset="UTF-8"/>
<title>my app</title>
<script src="bower_components/rave/rave.js"></script>
</head>
<body>
</body>
</html>
myapp.jsを用意して
alert("hello world");
ブラウザでindex.htmlを読み込めばok!
と思いきや、現状、require関数が一度は実行されないとエラーになってしまうようなので
jqueryをダウンロードして、とりあえず読み込んでおきましょう...
bower install jquery --save
require("jquery");
alert("hello world");
Note
require("jquery");
の戻り値はjQueryオブジェクトではありません。
理由はjQueryがAMD等に沿った記述になっていないからです。
jQueryオブジェクトが必要な場合はグローバル変数から取得する必要があります。
var jquery = (typeof global !== "undefined" && global !== null ? global.jQuery : void 0) || (typeof window !== "undefined" && window !== null ? window.jQuery : void 0);
ただし、別途jsを組むことで、require("jquery");
の戻り値をjQueryオブジェクトにする方法はあります。
所感
RequireJSと違って、ライブラリのパス等(require.config)を書かなくていいのが非常に楽でした。
ただし、まだ問題も残っているようで、markdownのライブラリが読み込めないなんてことがありました。
が、それも今後解消されていくでしょう。