[Sencha Touch] Microloader

存在於index.html之中

之前因為Sean碰到裡面include microloader/development.js時
build後用phonegap package無法正常跑

稍微研究了一下microloader

microloader主要是把我們加在app.json內的js和css dependencies，
在開index.html或者build時加到index.html，
像是做個控管，所以我們只需要加到一邊就好，不需要app.json也加，index.html也加。



microloader是Sencha Touch 2.0.0開始才有
目前版本的Sencha Touch SDK是2.1.0-b3 touch
裡面有三種microloader: development.js, testing.js, production.js

不一樣的地方是


 development 
是最簡易的microloader，直接parse就把結果丟到index.html內。
但只適合在沒有要build的情況下測試時使用，
要build不能用這一個。

 testing 
是次簡易的，跟developer差不多，只是把要做的事情寫成function，
像是這樣：Ext.blink = function() { ... };
適合在build的時候使用，沒有build不能直接使用，
因為要做的事情在function裡頭，直接include沒有作用。

 production 
最複雜的，也做最多事情的。
跟testing一樣，主要要做的事情也是寫成function，
build的時候使用，沒有build不能直接使用。
跟testing不一樣的地方是，它多做了很多其他的事情，
像是設定HTML5的manifest去做client端cache、版本設定...等。

至於後兩者為什麼要把主要要做的事情寫成function？

因為在build的時候會跑到app-build.js這個檔，
而這個檔其中一個部份是在把原有的index.html壓縮
和把該要include的dependencies加進來，
做法是去讀原有的index.html內容，只要讀到microloader這三個檔名，
就去呼叫讀到的檔名，不是馬上執行要用的，所以寫成function。

但有個bug...
它不會去判斷注解，就算是在注解裡面include到這三個檔案，他也還是會跑。
我們碰到的情況是
<!-- <script type="xxxx" src="touch/src/microloader/development.js"/> -->
<script type="xxxx" src="touch/src/microloader/testing.js"/>
結果它就做了兩遍...生出來的index.html變得很妙...