EmberJS - 创建和运行应用程序

您可以轻松地在系统中配置 Ember.js。EmberJS 安装章节中解释了 Ember.js 的安装。

创建应用程序

让我们使用 Ember.js 创建一个简单的应用程序。首先创建一个用于创建应用程序的文件夹。例如，如果您创建了“emberjs-app”文件夹，则导航到该文件夹​​：

$ cd ~/emberjs-app

在“emberjs=app”文件夹中，使用新命令创建一个新项目 -

$ ember new demo-app

创建项目时，新命令提供以下包含文件和目录的目录结构 -

|-- app
|-- bower_components
|-- config
|-- dist
|-- node_modules
|-- public
|-- tests
|-- tmp
|-- vendor

bower.json
ember-cli-build.js
package.json
README.md
testem.js

  • app - 它指定模型、路线、组件、模板和样式的文件夹和文件。

  • Bower_components / Bower.json - 用于管理 HTML、CSS、JavaScript、图像文件等组件，可以使用 npm 安装。Bower_components目录包含所有 Bower 组件，bower.json包含由 Ember、Ember CLI Shims 和QUnit安装的依赖项列表。

  • config - 它包含用于配置应用程序设置的environment.js目录。

  • dist - 它包括构建应用程序时部署的输出文件。

  • node_modules / package.json - NPM 是 Node.js 的节点包管理器，用于安装、共享和管理项目中的依赖项。package.json 文件包含应用程序的当前 npm 依赖项，并且列出的包安装在node_modules目录中。

  • public - 它包括图像、字体等资产。

  • vendor - 这是一个目录，其中前端依赖项（例如 JavaScript、CSS）不受 Bower go 控制。

  • tests / testem.js - 自动化测试存储在测试文件夹下，Ember CLI 的测试运行器testem安排在testem.js中。

  • tmp - 它包含 Ember CLI 的临时文件。

  • ember-cli-build.js - 它指定如何使用 Ember CLI 构建应用程序。

运行应用程序

要运行应用程序，请导航到新创建的项目目录 -

$ cd demo-app

我们已经创建了新项目，并且可以使用下面给出的命令运行 -

$ ember server

现在打开浏览器并导航到http://localhost:4200/。您将看到 Ember 欢迎页面，如下图所示 -

Ember.js 应用示例