Aurelia - Complementos

Cuando comiences a crear tu aplicación, la mayoría de las veces querrás usar algunos complementos adicionales. En este capítulo, aprenderá a utilizar complementos en el marco de Aurelia.

Complementos estándar

En el último capítulo, vimos cómo usar la configuración predeterminada en el marco de Aurelia. Si está utilizando la configuración predeterminada, estará disponible un conjunto estándar de complementos.

  • defaultBindingLanguage() - Este complemento ofrece una manera fácil de conectarse view-model con view. Ya vio la sintaxis de enlace de datos unidireccional(${someValue}). Aunque podría utilizar algún otro lenguaje de vinculación, es una práctica recomendada utilizar el lenguaje de vinculación predeterminado.

  • defaultResources() - Los recursos predeterminados nos dan algunas construcciones primitivas como if, repeat, compose, etc. Incluso puedes construir estas construcciones por tu cuenta, pero como se usan tan comúnmente, Aurelia ya las creó dentro de esta biblioteca.

  • Router()- La mayoría de las aplicaciones utilizan algún tipo de enrutamiento. Por lo tanto,Routeres parte de los complementos estándar. Puede consultar más sobre el enrutamiento en un capítulo posterior.

  • History() - El complemento de historial generalmente se usa junto con router.

  • eventAggregator()- Este complemento se utiliza para la comunicación entre componentes. Maneja la publicación y la suscripción a mensajes o canales dentro de su aplicación.

Complementos oficiales

Estos complementos no forman parte de la configuración predeterminada, pero se utilizan con frecuencia.

  • fetch()- El complemento Fetch se utiliza para manejar solicitudes HTTP. Puede usar alguna otra biblioteca AJAX si lo desea.

  • animatorCSS() - Este complemento ofrece una forma de manejar animaciones CSS.

  • animator-velocity()- En lugar de animaciones CSS, puede utilizar la biblioteca de animaciones Velocity. Estos complementos nos permiten usar Velocity dentro de las aplicaciones de Aurelia.

  • dialog() - El complemento de diálogo ofrece una ventana modal altamente personalizable.

  • i18n() - Este es el complemento para internalización y localización.

  • ui-virtualization() - La virtualización es una biblioteca útil para manejar tareas de interfaz de usuario de gran rendimiento.

  • validation() - Utilice este complemento cuando necesite validar sus datos.

Todos los complementos explicados anteriormente son mantenidos oficialmente por Aurelia Core Team en el momento de escribir este tutorial. Se agregarán otros complementos útiles en el futuro. El siguiente ejemplo muestra cómo configurar su aplicación para usar complementos.

Instalación de complementos

Si, por ejemplo, queremos usar animator-css y animator-velocity, primero tenemos que instalarlo.

C:\Users\username\Desktop\aureliaApp>jspm install aurelia-animator-css
C:\Users\username\Desktop\aureliaApp>jspm install aurelia-animator-velocity

En el último capítulo, aprendió a utilizar la configuración manual. Podemos agregar nuestros complementos enmain.js archivo.

main.js

export function configure(aurelia) {
   aurelia.use
   .defaultBindingLanguage()
   .defaultResources()
   .developmentLogging()
   .router()
   .history()
   .eventAggregator()
   .plugin('aurelia-animatorCSS')
   .plugin('aurelia-animator-velocity')

   aurelia.start().then(() => aurelia.setRoot());
}