Aurelia - 第一个应用

• 

  简述

  在本章中，我们将解释在上一章中创建的 Aurelia 启动应用程序。我们还将引导您了解文件夹结构，以便您掌握 Aurelia 框架背后的核心概念。
• 

  文件夹结构

  • package.json表示有关的文档npm安装的软件包。它还显示了这些包的版本，并提供了一种简单的方法来添加、删除、更改版本或在需要在开发人员之间共享应用程序时自动安装所有包。
  • index.html与大多数基于 HTML 的应用程序一样，是应用程序的默认页面。它是加载脚本和样式表的地方。
  • config.js是 Aurelia 加载器配置文件。您不会花费太多时间来处理此文件。
  • jspm_packages是目录SystemJS加载的模块。
  • styles是默认的样式目录。您可以随时更改保存样式文件的位置。
  • src文件夹是您将花费大部分开发时间的地方。它使HTML和js文件。
• 

  源文件

  正如我们已经说过的，src目录是你的应用程序逻辑将被保存的地方。如果您查看默认应用程序，您会看到app.js和app.html非常简单。

  Aurelia 允许我们使用 JavaScript 核心语言进行类定义。以下默认示例显示 EC6 类。

  应用程序.js

  
  export class App {
     message = 'Welcome to Aurelia!';
  }
  

  这message属性绑定到 HTML 模板使用${message}句法。此语法表示转换为字符串并显示在模板视图中的单向绑定。

  应用程序.html

  
  <template>
     <h1>${message}</h1>
  </template>
  

  正如我们在上一章中已经讨论过的，我们可以通过在command prompt窗户。

  
  C:\Users\username\Desktop\aureliaApp>http-server -o -c-1
  

  应用程序将呈现在屏幕上。