Aurelia - 配置

  • 简述

    在本章中,我们将向您展示如何根据您的需要配置 Aurelia 框架。有时您需要在应用程序呈现给用户之前设置初始配置或运行一些代码。
  • 第 1 步 - 创建 main.js

    让我们创建main.js里面的文件src文件夹。在这个文件中,我们将配置 Aurelia。
    您还需要告诉 Aurelia 加载配置模块。您可以在以下示例中看到注释部分。

    索引.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>
    
  • 第 2 步 - 默认配置

    下面的代码显示了如何使用默认配置。configure功能允许手动设置配置。我们正在设置use属性来指定我们需要什么。

    main.js

    
    export function configure(aurelia) {
       aurelia.use
       .standardConfiguration()
       .developmentLogging();
       aurelia.start().then(() => aurelia.setRoot());
    }
    
  • 第 3 步 - 高级配置

    我们可以使用很多配置选项。向您展示所有内容超出了本文的范围,因此我们将在以下示例中解释配置的工作原理。我们基本上是在告诉 Aurelia 使用default data binding language, default resources, development logging, router, historyevent aggregator. 这些是标准的插件集。
    
    export function configure(aurelia) {
       aurelia.use
       .defaultBindingLanguage()
       .defaultResources()
       .developmentLogging()
       .router()
       .history()
       .eventAggregator();
       aurelia.start().then(() => aurelia.setRoot());
    }
    
    注意− 这些设置将在下一章详细说明。