Sencha ExtJS 4 - Básico hola demostración mundo emite

Mirando en ExtJS 4 y yo estoy tratando de hacer el tutorial "Hello World" aquí: http://www.sencha.com/learn/getting-started-with-ext-js-4/Sencha ExtJS 4 - Básico hola demostración mundo emite

Tengo toda mi configuración de archivos como se recomienda en el tutorial:

enter image description here

Pero, sigo obteniendo un error debido a la sintaxis funky que comienza su archivo:

enter image description here

No estoy usando JQuery ni ninguna otra biblioteca, ya que se supone que Sencha es un entorno completo de JavaScript.

Aquí está el código completo:

app.js

<a href="#!/api/Ext-method-application" rel="Ext-method-application" class="docClass">Ext.application</a>({ 
    name: 'HelloExt', 
    launch: function() { 
     <a href="#!/api/Ext-method-create" rel="Ext-method-create" class="docClass">Ext.create</a>('<a href="#!/api/Ext.container.Viewport" rel="Ext.container.Viewport" class="docClass">Ext.container.Viewport</a>', { 
      layout: 'fit', 
      items: [ 
       { 
        title: 'Hello Ext', 
        html : 'Hello! Welcome to Ext JS.' 
       } 
      ] 
     }); 
    } 
});

index.html

<!doctype html> 
<html> 
<head> 
    <title>Hello Ext</title> 

    <link rel="stylesheet" type="text/css" href="extjs/resources/css/ext-all.css"> 
    <script type="text/javascript" src="extjs/ext-debug.js"></script> 
    <script type="text/javascript" src="app.js"></script> 
</head> 
<body></body> 
</html>

¿Alguna idea sobre lo que podría ser el culpable?

Fuente

2012-01-18 PhillipKregg

Se supone que no debe tener ningún HTML en un archivo JS. El código en el tutorial está arruinado. Esas etiquetas href de anclaje son enlaces a la documentación de la API ExtJS, que de alguna manera se insertó en el código de ejemplo.

El código real debe ser:

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

He puesto un informe de error sobre esa página aquí: http://www.sencha.com/forum/showthread.php?175129-Documentation-Getting-Started-with-Ext-JS-4.0&p=717098#post717098

añadido Jan, 2012: al parecer, la versión correcta de ese el tutorial está disponible en: http://docs.sencha.com/ext-js/4-0/#!/guide/getting_started

Fuente

2012-01-18 20:00:04 Mchl

Ahhh ok gracias - Sólo pensé que estaban utilizando algún tipo de sintaxis loco en su código. – PhillipKregg

necesita actualizar sus "app.js" (tira a etiquetas HTML):

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

Javascript analizador no entiende las etiquetas de HTML que le pasó a copiar al crear su archivo "app.js".

Fuente

2012-01-18 19:59:36 Li0liQ

Esta es la página HTML mínima para ejecutar ExtJS 4 sin MVC:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
<html> 
    <head> 
     <link href="/ext/4.0.0/resources/css/ext-all.css" rel="stylesheet" /> 
     <script src="/ext/4.0.0/ext-all.js"></script> 
    </head> 
    <body> 
     <script> 
      Ext.onReady(function() { 
       Ext.Msg.alert('Welcome', 'Hello, World!'); 
      }); 
     </script> 
    </body> 
</html>

y éste es con MVC:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
<html> 
    <head> 
     <link href="/ext/4.0.7/resources/css/ext-all.css" rel="stylesheet" /> 
     <script src="/ext/4.0.7/ext-all.js"></script> 
     <script src="/app.js"></script> 
    </head> 
    <body></body> 
</html>

El código de aplicación.JS:

Ext.application({ 
    name: 'HelloWorld', 
    launch: function() { 
     Ext.Msg.alert('Welcome', 'Hello, World!'); 
    } 
});

Más detalles en mi demostraciones en línea:

ExtJS 4 "Hello World" Application

ExtJS 4 "Hello World" Application Using Ext Loader

ExtJS 4 MVC "Hello World" Application

Fuente

2017-05-29 12:51:15 khmurach

Sencha ExtJS 4 - Básico hola demostración mundo emite

Respuesta

Cuestiones relacionadas