Aurelia - 配置

在本章，我们将展示如何根据自己的需求配置 Aurelia 框架。有时候，您需要在应用程序呈现在用户面前之前设置初始配置或运行一些代码。

步骤 1 - 创建 main.js

让我们在 src 文件夹中创建一个 main.js 文件。我们将在此文件中配置 Aurelia。

您还需要告知 Aurelia 加载配置模块。您可以在下面的示例中看到带注释的部分。

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>

步骤 2 - 默认配置

下面的代码展示了如何使用默认配置。configure 函数允许手动设置配置。我们设置 use 属性以指定我们需要的内容。

main.js

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

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

步骤 3 - 高级配置

有很多我们可以使用的配置选项。这里无法一一展示，我们将在下面的示例中说明配置的工作机制。我们基本上让 Aurelia 使用 默认数据绑定语言、默认资源、开发日志记录、路由器、历史记录 和 事件聚合器。这是一组标准的插件。

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

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

注意 - 这些设置将在下一章中详细解释。

打印页面

上一个

下一个