[Cookbook Study Ch01]5. Dynamically Loading Ext JS Classes

// Configure the Ext.Loader class
Ext.Loader.setConfig({
	enabled : true,
	paths : {
		'Cookbook' : 'src/Cookbook'
	}
});
Ext.onReady(function() {
	// 동적 로딩 클래스에 대한 예제이다.
	// 상단에서 path를 잡아주었고 하단에서 require하면
	// 팔요한 클래스가 로딩되어 사용이 가능해 진다.
	// 단지 이러한 동적클래스 로딩은 개발모드에서 사용되어 진다고 봐야한다.
	// 운영환경에서는 정적으로 모든 클래스를 로딩할 수 밖에 없는 환경이므로(압축 및 최적화)..
	// 또한 아래와 같이 할 경우 인스펙터 상의 'Elements탭'의 html에서 자동으로 자바스크립트 링크가 
	// 생성된 것을 확인할 수 있다.
	// Create an instance of the Cookbook.Vehicle class inside the Ext.require() callback
	Ext.require('Cookbook.Vehicle', function() { // 이 부분이 있고 없고에 따라
//		var plane = Ext.create('Cookbook.Vehicle', 'Ford', 'Transit', 60);
//		plane.travel(200);
	});
//
//	// Create an instance of the Cookbook.Plane class inside the Ext.require() callback
//	Ext.require('Cookbook.Plane', function() {
//		var plane = Ext.create('Cookbook.Plane', 'Boeing', '747', 500, 35000);
//		plane.travel(200);
//	});
});
// 출처 : Ext JS4 Web Application Development Cookbook

require를 통해 로딩된 클래스 파일을 확인 할 수 있다.

아래 그림은 예제소스를 실행하고 있는 html파일의 내용이다. 위의 인스펙터와는 달리 Vehicle.js를 불러오고 있지 않다는 것을

확인 할 수 있다.