En este documento se explican los detalles del proyecto creado al utilizar el tipo de archivo para crear una aplicación de una sola página (SPA) basada en el marco de Angular. Es decir, cuando se establece la opción frontendModule
en angular
.
Este proyecto se cuenta con la CLI de Angular.
Esta aplicación está diseñada para consumir el modelo AEM de un sitio. Generará automáticamente el diseño utilizando los componentes de ayuda del paquete @adobe/cq-angular-editable-components.
En el directorio del proyecto, puede ejecutar los siguientes comandos.
npm start
Este comando ejecuta la aplicación en modo de desarrollo mediante el proxy del modelo JSON desde una instancia de AEM local que se ejecuta en http://localhost:4502. Esto supone que todo el proyecto se ha implementado para AEM al menos una vez (mvn clean install -PautoInstallPackage
en la raíz del proyecto).
Después de ejecutar npm start en el directorio ui.frontend, la aplicación se abrirá automáticamente en el explorador (en la ruta http://localhost:4200/content/${appId}/${country}/${language}/home.html). Si realiza ediciones, la página se volverá a cargar.
Si está obteniendo errores relacionados con CORS, es posible que desee configurar AEM de la siguiente manera:
npm test
Este comando inicia el ejecutador de prueba Karma. Para obtener más información, consulte la documentación de Angular sobre la ejecución de pruebas.
npm run test:debug
Este comando inicia el ejecutor de pruebas de Karma en modo de reloj interactivo.
npm run build
Este comando crea la aplicación para producción en la carpeta de compilación. Agrupa el Angular en modo de producción y optimiza la compilación para obtener el mejor rendimiento. Consulte la documentación del Angular sobre la implementación para obtener más información.
Además, se genera un AEM ClientLib desde la aplicación utilizando el paquete aem-clientlib-generator.
Consulte la documentación general del módulo ui.frontend para obtener más información sobre cómo el tipo de archivo del proyecto de AEM utiliza AEM ClientLibs.
De forma predeterminada, este proyecto utiliza la opción predeterminada Browserslist para identificar los navegadores de destino. Además, incluye polirellenos para las funciones de lenguaje moderno que admiten navegadores más antiguos (por ejemplo, Internet Explorer 11). Si la compatibilidad con estos exploradores no es un requisito, se pueden eliminar las dependencias y las importaciones de polyfill.