ModuleにDisられた

Moduleの気持ちよさを語らせたら社内一、でおなじみの片山です。

表題のModuleですが、皆さんModuleManagerやModuleLoaderを使ってロードしているかと思います。
私もご多分に漏れずロードしまくっていますが、最近swf自体はもって来れている（ModuleEvent.READYは呼ばれている）のに、Moduleが作れない事態に陥りました。

var moduleInfo:IModuleInfo = ModuleManager.getModule("ILoveModule.swf");
moduleInfo.addEventListener(ModuleEvent.READY,function(e:ModuleEvent):void{
   //ここでエラーならずに、nullが返って来る！
   var module:Module = Module(e.module.factory.create());
   parent.addChild(module);
}
moduleInfo.load();

module.factory.create()でnullが返って来ます。


なんでやねん・・・と思いつつ調べていくと、原因はCSSでした。


どうやら呼び元に定義済みのCSSセレクタがModuleの方のCSSセレクタに定義されている場合、Module生成に失敗するようです。

例えば

HogeApp
  |-main.css
         |-Test{name:"hogeApp"}

HogeModule
  |-hoge.css
        |-Test{name:"hogeModule"}
}

みたいな感じで、HogeAppからHogeModuleをロードするとうまく行かないようです。
特にエラーが出ないのでほんとにこれが理由か分かりませんが、現象を見る限りはそのようです。
ModuleのApplicationDomainを呼び出し元と同じにしてもダメでした。
なので、Moduleをうまくロード出来ない時は、CSSを疑ってみるといいかもしれません。


あと余談ですが、Moduleに定義したCSSはModuleインスタンス化時にStyleManagerに登録されるようです。
従って、

<mx:Module xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">	
  <mx:Style source="module.css"/>
</mx:Module>

というようなModuleを作成して、CSSにひとしきりクラス定義しておいて、Moduleロード後にModuleをインスタンス化だけしてあとはスタイル内の定義やクラスを使うということが可能です。