当前位置: 首页 > 文档资料 > EmberJS 入门教程 >

创建和运行应用程序(Creating and Running Application)

优质
小牛编辑
128浏览
2023-12-01

您可以在系统中轻松配置Ember.js. EmberJS安装章节中介绍了Ember.js的安装

创建应用程序

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

$ cd ~/emberjs-app

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

$ ember new demo-app

创建项目时,new命令提供以下具有文件和目录的目录结构 -

|-- 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控制。

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

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

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

运行应用程序

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

$ cd demo-app

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

$ ember server

现在打开浏览器并导航到http://localhost:4200/ 。 您将获得Ember Welcome页面,如下图所示 -

Ember.js应用示例