ember.jsember.js入门


备注

本节概述了ember.js是什么,以及开发人员可能想要使用它的原因。

它还应该提到ember.js中的任何大型主题,并链接到相关主题。由于ember.js的文档是新的,您可能需要创建这些相关主题的初始版本。

版本

最新发布

发布日期
2.14.0 beta 2017年4月29日
2.13.0 2017年4月29日

安装或设置

开始使用Ember很容易。通过我们的命令行构建工具Ember CLI创建和管理Ember项目。该工具提供:

  • 现代应用程序资产管理(包括连接,缩小和版本控制)。
  • 生成器有助于创建组件,路由等。
  • 传统的项目布局,使现有的Ember应用程序易于接近。
  • 通过Babel项目支持ES2015 / ES6 JavaScript。这包括对本指南中使用的JavaScript模块的支持。
  • 完整的QUnit测试工具。
  • 消耗不断增长的Ember Addons生态系统的能力。

依赖

Node.js和npm

Ember CLI是使用JavaScript构建的,并且需要Node.js运行时。它还需要通过npm获取的依赖项。 npm与Node.js打包在一起,所以如果你的计算机安装了Node.js,你就可以开始了。

Ember要求Node.js为0.12或更高,npm为2.7或更高。如果您不确定是否有Node.js或正确的版本,请在命令行上运行:

node --version
npm --version

如果您收到“命令未找到”错误或Node的过期版本:

如果你得到过时的npm版本,请运行npm install -g npm

混帐

Ember需要Git来管理它的许多依赖项。 Git附带Mac OS X和大多数Linux发行版。 Windows用户可以下载并运行此Git安装程序

守望者(可选)

在Mac和Linux上,您可以通过安装Watchman来提高文件监视性能。

PhantomJS(可选)

您可以使用PhantomJS从命令行运行测试,而无需打开浏览器。请参阅PhantomJS下载说明

安装

使用npm安装Ember:

npm install -g ember-cli

要验证安装是否成功,请运行:

ember -v

如果显示版本号,您就可以开始了。

分配localhost端口(特别是权限/可用性问题,同时运行多个ember站点)

有时,使用默认值手动分配一个或多个端口很有用。这样做可以解决端口可用性/权限问题或一次运行多个ember实例。


要让ember-cli尝试识别和分配可用端口,请使用:

ember serve --port 0
 

Per ember help:“传递0以自动选择可用端口”。 (在终端中,键入ember帮助)。


要同时运行多个ember站点,每个站点都需要自己的服务器和实时重新加载端口。一个简单的方法:在单独的终端窗口中导航到每个实例并使用以下命令使用自己的端口启动它们:

ember serve --port 0 --live-reload-port 0
 

如果在任何这些情况下出现有关可用性或权限的错误,请在终端提示符处输入以下python脚本以标识可用端口:

python -c 'import socket; s=socket.socket(); s.bind(("", 0)); print(s.getsockname()[1]); s.close()'
 

使用结果指定您现在知道可用的端口:

ember serve --port <known_port_1> --live-reload-port <known_port_2>
 

创建应用程序

Ember CLI允许您使用以下两个选项之一来生成新应用:

  1. 创建一个文件夹并运行ember init (生成应用程序结构并设置git并进行第一次提交)
  2. 运行ember new <app name> (创建一个具有指定名称的文件夹,进入它并运行ember init

生成过程完成后,通过运行以下命令在app文件夹中引导实时重新加载服务器:

ember server
 

或简称为ember s 。 * Ta-da,现在你有一个正在运行的Ember应用程序! 官方文件

创建第一个模板

让我们使用ember generate 命令创建一个新模板。

ember generate template application
 

当用户访问您的应用程序时, application 模板始终在屏幕上。在您选择的编辑器中,打开app/templates/application.hbs 并添加以下代码:

<h2>My first Ember application</h2>

{{outlet}}
 

现在,您应该在应用程序的欢迎页面上看到新添加的文本。另请注意,Ember会自动检测新文件并为您重新加载页面。干净吧?

部署应用程序

要部署Ember应用程序,只需将输出从ember构建转移到Web服务器。这可以使用标准的Unix文件传输工具完成,例如rsyncscp 。还有一些服务可以让您轻松部署。

ember build
scp -r dist/* myserver.com:/var/www/public/
 

通常我们会使用ember build --environment=production 来做更多的ember build --environment=production 来使你的代码准备好生产(gzip和minify代码)。

如何使用JavaScript插件

有四种方法可以使用JavaScript插件,

  1. Ember附加组件
  2. 全局导入JavaScript插件
  3. 消费命名为AMD插件
  4. 通过ember-browserify