IT戦記

プログラミング、起業などについて書いているプログラマーのブログです😚

MochiKit-1.3.1 と dojo-0.3.1 との連携

JavaScript

今日

d:id:Voluntas:20061004 さんからトラックバックをいただいたので試してみました。

たとえば

それぞれ、こんな感じで解凍したまんま配置します。

sample.html の内容は

こんな感じにしてみました。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
          "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
 <head>
  <meta http-equiv="Content-Language" content="ja" />
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title>hoge</title>
  <meta http-equiv="Content-Style-Type" content="text/css; charset=utf-8" />
  <meta http-equiv="Content-Script-Type" content="text/javascript; charset=utf-8" />
  <script type="text/javascript">
// <![CDATA[
var djConfig = {
 compat: '0.2.2'
};
var MochiKit = {
 __compat__: true
};
// ]]>
  </script>
  <script type="text/javascript" src="dojo-0.3.1-ajax/dojo.js"></script>
  <script type="text/javascript">
// <![CDATA[
dojo.setModulePrefix('MochiKit', '../MochiKit-1.3.1/lib/MochiKit');
dojo.require('MochiKit.*');
// ]]>
  </script>
 </head>
 <body>
  <h1>ちょうテスト</h1>
 </body>
</html>

そうすると

Firebug とかで確認すると Ajax で依存関係が読み込まれているのが分かります。
ちゃんと連携されてました ^^
でも、 Ajax で読み込むと eval されるので重いです。なので最終的には dojo.js と packed/MochiKit.js/MochiKit.js と他の dojo のクラスたちを連結させてひとつのファイルにして一番上に

var djConfig = {
 compat: '0.2.2'
};
var MochiKit = {
 __compat__: true
};

と追加すればいいと思います。

ちなみに

この

var MochiKit = {
 __compat__: true
};

という記述は、 MochiKit の様々なクラスをグローバル領域にエクスポートするためのものです。 MochiKit.Color.Color などのようにフルパスで指定してもいい場合は false を指定するか、何も指定しないで OK です。
MochiKit はパッケージ管理システム(dojoやJSAN)といっしょに読み込まれるとグローバル領域を汚さないようにします。
それを逆に防ぐための方法です。