Aurelia - Configuration

Dans ce chapitre, nous allons vous montrer comment configurer le framework Aurelia pour vos besoins. Parfois, vous devrez définir une configuration initiale ou exécuter du code avant que l'application ne soit rendue aux utilisateurs.

Étape 1 - Créez main.js

Créons main.js fichier à l'intérieur srcdossier. Dans ce fichier, nous allons configurer Aurelia.

Vous devez également dire à Aurelia de charger le module de configuration. Vous pouvez voir la partie commentée dans l'exemple suivant.

index.html

<!DOCTYPE html>
<html>
   <head>
      <title>Aurelia</title>
      <link rel = "stylesheet" href = "styles/styles.css">
      <meta name = "viewport" content = "width=device-width, initial-scale = 1">
   </head>

   <body aurelia-app = "main"> 
      <!--Add "main" value to "aurelia-app" attribute... -->
      <script src = "jspm_packages/system.js"></script>
      <script src = "config.js"></script>
		
      <script>
         SystemJS.import('aurelia-bootstrapper');
      </script>
   </body>
</html>

Étape 2 - Configuration par défaut

Le code ci-dessous montre comment utiliser la configuration par défaut. configureLa fonction permet de définir la configuration manuellement. Nous établissonsuse propriété pour spécifier ce dont nous avons besoin.

main.js

export function configure(aurelia) {
   aurelia.use
   .standardConfiguration()
   .developmentLogging();

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

Étape 3 - Configuration avancée

Il existe de nombreuses options de configuration que nous pourrions utiliser. Il est hors de la portée de cet article de vous montrer tout cela, nous allons donc vous expliquer comment la configuration fonctionne sur l'exemple suivant. Nous disons essentiellement à Aurelia d'utiliserdefault data binding language, default resources, development logging, router, history et event aggregator. Il s'agit d'un ensemble standard de plugins.

export function configure(aurelia) {
   aurelia.use
   .defaultBindingLanguage()
   .defaultResources()
   .developmentLogging()
   .router()
   .history()
   .eventAggregator();

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

Note - Ces paramètres seront expliqués en détail dans le chapitre suivant.