[책펌] 센차터치(Sencha Touch)에서 라이브러리 동적 로딩(requires)을 위한, 패키지 경로 및 네임스페이스 설정 예시

- 출처: 센차터치2+폰갭 프로그래밍 –

※ 예제 파일 경로

/index.html => base 문서
/js/app.js => 센차 어플리케이션 js 파일 (index.html에서 로딩)
/js/package1/sub1.js => 로딩할 모듈

app.js

//네임스페이스 지정
Ext.ns('main');
Ext.application({
	name: 'Path',
	//실험 결과, requires의 기준경로는 application을 로딩한 html파일이 있는 곳이다.
	requires: [
	    'Ext.Panel',
	    'Ext.Toolbar',
	    'js.package1.sub1' //사용자정의 모듈 로딩
	],
	launch: function(){
		main.panel = new Ext.create('Ext.Panel', {
			fullscreen: true,
			items: [{
				xtype: 'toolbar',
				title: '패키지와 경로'
			}]
		});
		js.package1.sub1.obj.init();
		main.panel.add(js.package1.sub1.panel);
	}
});

sub1.js

//네임스페이스 지정
Ext.ns('js.package1.sub1');
js.package1.sub1.obj = {
	init: function(){
		Ext.require('Ext.Panel');
		js.package1.sub1.panel = new Ext.create('Ext.Panel', {
			flex: 1,
			html: 'Sub1 page<br>나중에 호출되어야 정상임'
		});
	}
};