Dojoでリモートのライブラリとローカルの自作コードを両立させる方法

Dojoでネット上にあるライブラリと，自前サーバにある自作コードを両立させて使う方法をメモしておきます．

まずは，状況設定です．「http://ajax.googleapis.com/ajax/libs/dojo/1.4/dojo/dojo.xd.js」に置かれているものをライブラリとして使うことにします．一方，次の図の「war/js/rfj」ディレクトリに置かれている「ScrollBar.js」を自作コードとして使うことにします．

この状況下で「ScrollBar.js」ファイルで定義されている「ScrollBar」クラスを「war/scroll_bar_test.html」ファイル内で使うためには，次のようなコードを記します．

<script
  type="text/javascript"
  src="http://ajax.googleapis.com/ajax/libs/dojo/1.4/dojo/dojo.xd.js"
  djconfig="parseOnLoad: true,
    baseUrl: './', modulePaths: {'rfj': 'js/rfj'}">
</script>
<script type="text/javascript">
dojo.require("rfj.ScrollBar");

dojo.addOnLoad(function() {
  var scrollBar = new rfj.ScrollBar();
);
</script>

ポイントは，最初のscript要素にあるdjconfig属性の値にあります．ローカルのコードが置かれている場所を「baseUrl: './', modulePaths: {'rfj': 'js/rfj'}」という記述で指定します．

baseUrlには，自作コードへのパスを記す際の起点となるディレクトリをこの記述が記されたHTMLファイルから見た相対パスで記します．今回は，「war/scroll_bar_test.html」ファイルがあるのと同じディレクトリを起点とするので，「./」を指定しています．

modulePathsには，Dojoでいうところのモジュールを置いてあるディレクトリのパスを記します．このパスは，baseUrlで指定したディレクトリからの相対パスとなります．「ScrollBar」クラスが定義されている「ScrollBar.js」ファイルは「war/js/rfj」ディレクトリにあるので，そのディレクトリを「war/scroll_bar_test.html」ファイルのあるディレクトリからの相対パスで記すと，「./js/rfj」となります．