ミニマイズ処理をする
一通り動作することが確認できたところで、r.jsを使ってミニマイズ処理をしてみましょう。ミニマイズ処理をする際には設定を引数で指定する事もできますが、リスト9のようにミニマイズ（ビルド）用の設定ファイルを用意しておくとよいでしょう。
({
baseUrl : "js", // （1） 起点となるディレクトリ指定
name : "main", // （2） data-main属性で指定したものと同じファイル
out : "all.js", // （3） 出力されるファイル
optimize : 'none' // （4） 最適化の指定
})
（1）ではファイルを探すための起点となるディレクトリの指定をします。続いて（2）ではdata-main属性で指定したファイルを指定します。ただし、「.js」の拡張子は省略して記述します。（3）ではミニマイズしたときの出力ファイル名を記述します。
ここまで記述すればミニマイズ処理はできますが、（4）ではミニマイズの時の最適化の指定をしています。"none"という指定は実際にはミニマイズをしない指定ですので、単にファイルを連結して1つのファイルにしている処理となります。通常のミニマイズを行う場合にはoptimizeの指定を削除し、デフォルトの動作になるようにします。
RequireJSでは多少間違った依存関係の記述方法でも、実際のJavaScriptの読込結果によってはエラーが発生せず実行できたり、また、エラーが発生したりするケースがあります。その場合には、この（4）の指定をすることで、実際にファイルが読みこまれる順番で1つのファイルにしているので、意図と違った順番となってしまっている場合には、正しく依存が記述できていないことがわかります。
そして、実行はリスト10のように行います。
r.js -o build.js （Linux/Macの場合） r.js.cmd -o build.js （Windowsの場合）
ここで出力されたファイルを利用するには、リスト11のようにdata-main属性に出力されたファイルをjs/main.jsの代わりに指定します。
<script type="text/javascript" data-main="all.js" src="vendors/require.js"></script>
このように、RequireJSを使えば開発中での分割したファイル構造にも、またリリース時のミニマイズしたファイルの利用でもほぼソースに変更がなく利用することができ、また、AngularJSでのコードも他に依存しない形での記述が可能なために、再利用もしやすくなります。
最後に
今回はRequireJSとAngularJSをできるだけ簡単に統合して使う方法を紹介しましたが、RequireJSにはもっと細かい設定が可能ですので、興味のある方はRequireJSの公式サイトなどを参照してください。
また、AngularJSにはこれまで紹介しきれなかった機能などがたくさんあります。そして、RequireJS以外にも、AngularJSと一緒に使うことで便利になるツールも多々あります。
今回でAngularJSの紹介は最終回となりますが、今までの連載でAngularJSの機能や使い方など少しでも皆様の参考になれば幸いです。
