Render Ext.application en un div

Estoy intentando ejecutar una aplicación Ext.application Ext Ext.application dentro de nuestra plantilla de sitio web existente. Tenemos un contenido div #content , en el que quiero colocar la aplicación para el desarrollo. ¿Cómo presento la aplicación en esta área, en lugar de reemplazar la página html existente?

 Ext.application({ name: 'HelloExt', launch: function() { Ext.create('Ext.container.Viewport', { layout: 'fit', // renderTo: Ext.Element.get('#content') doesn't work items: [ { title: 'Hello Ext', html : 'Hello! Welcome to Ext JS.' } ] }); } }); 

Necesita usar otro contenedor que Ext.container.Viewport . Definiton Ext.container.Viewport siempre tomará toda la ventana del navegador.

De la documentación:

La ventana gráfica se muestra en el cuerpo del documento y se ajusta automáticamente al tamaño de la ventana del navegador y gestiona el cambio de tamaño de la ventana. Solo puede haber una ventana gráfica creada en una página.

Simplemente use Ext.panel.Panel en Ext.panel.Panel lugar

 Ext.application({ name: 'HelloExt', launch: function() { Ext.create('Ext.panel.Panel', { layout: 'fit', renderTo: Ext.get('content') items: [ { title: 'Hello Ext', html : 'Hello! Welcome to Ext JS.' } ] }); } });