Aurelia - Primera aplicación
En este capítulo, explicaremos la aplicación de inicio de Aurelia creada en nuestro último capítulo. También lo guiaremos a través de la estructura de carpetas, para que pueda comprender los conceptos básicos detrás del marco de Aurelia.
Estructura de carpetas
package.json representa documentación sobre npmpaquetes instalados. También muestra la versión de esos paquetes y proporciona una manera fácil de agregar, eliminar, cambiar la versión o instalar automáticamente todos los paquetes cuando la aplicación debe compartirse entre desarrolladores.
index.htmles la página predeterminada de la aplicación como en la mayoría de las aplicaciones basadas en HTML. Es un lugar donde se cargan los scripts y las hojas de estilo.
config.jses el archivo de configuración del cargador Aurelia. No pasará mucho tiempo trabajando con este archivo.
jspm_packages es el directorio para el SystemJS módulos cargados.
styleses el directorio de estilo predeterminado. Siempre puede cambiar el lugar donde guarda sus archivos de estilo.
srcLa carpeta es un lugar donde pasará la mayor parte del tiempo de desarrollo. MantieneHTML y js archivos.
Archivos fuente
Como ya dijimos, el srcdirectorio es el lugar donde se guardará la lógica de su aplicación. Si observa la aplicación predeterminada, puede ver queapp.js y app.html son muy simples.
Aurelia nos permite usar el lenguaje central de JavaScript para las definiciones de clases. El siguiente ejemplo predeterminado muestra la clase EC6.
app.js
export class App {
message = 'Welcome to Aurelia!';
}
los message La propiedad está vinculada a la plantilla HTML usando ${message}sintaxis. Esta sintaxis representa el enlace unidireccional convertido en cadena y mostrado dentro de la vista de plantilla.
app.html
<template>
<h1>${message}</h1>
</template>
Como ya comentamos en el último capítulo, podemos iniciar el servidor ejecutando el siguiente comando en el command prompt ventana.
C:\Users\username\Desktop\aureliaApp>http-server -o -c-1
La aplicación se mostrará en la pantalla.