EmberJS 环境配置
通过将JavaScript库文件包含在HTML文件中的<script>标记中,可以轻松配置Ember.js;这可以通过以下两种方式完成:您可以从其官方网站下载最新版本的Ember.js JavaScript库文件。您可以从官方网站包括最新版本的CDN。下载JavaScript库在安装emberjs之前,它应该要求在具有兼容浏览器的系统上安装nodejs。在nodejs命令行界面中使用以下命令安装emberjs:npm install -g ember-cli
要创建应用程序,请使用以下命令 - ember new my-app
CDN来自官方网站CDN或内容传送网络是设计为向用户提供文件的服务器网络。如果您在网页中使用CDN链接,它将托管文件的责任从您自己的服务器迁移到一系列外部服务器。这也提供了一个优点,如果您的网页的访问者已经从相同的CDN下载了Ember.js的副本,则不必重新下载。在使用Ember.js时,你需要把这些CDN的js文件引入: jQuery Handlebars Ember.js 所有CDN都从这里获取 <script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/3.0.1/handlebars.min.js"</script>
<script src="https://code.jquery.com/jquery-2.1.3.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/ember.js/1.10.0/ember.min.js"></script>
<script src="https://builds.emberjs.com/tags/v1.10.0-beta.3/ember-template-compiler.js"></script>
<script src="https://builds.emberjs.com/release/ember.debug.js"></script>
<script src="https://builds.emberjs.com/beta/ember-data.js"></script>以下是成功生成的不同软件包: ember.debug.js:这是一个完整的开发版本。它包括几乎所有的包。 jQuery-2.1.3.min.js:它删除不必要的字符,使文件大小更小。 ember.prod.js:生产文件删除任何调试语句和/或断言。它包括所有包,除了: handlebars.min.js ember.debug.js handlebars.min.js:它用于有效地构建语义模板。 ember-template-compiler.js:模板编译器可以用于服务器端进行预编译。 ember-data.js:它用于处理Ember数据。在本教程程序的所有章节中,我们引用了Ember.js JavaScript库的最新CDN。例子让我们创建一个使用Ember.js一个简单的例子: <!DOCTYPE html>
<html>
<head>
<title>Ember.js Application example</title>
<!-- CDN's -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/3.0.1/handlebars.min.js"></script>
<script src="https://code.jquery.com/jquery-2.1.3.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/ember.js/1.10.0/ember.min.js"></script>
<script src="https://builds.emberjs.com/tags/v1.10.0-beta.3/ember-template-compiler.js"></script>
<script src="https://builds.emberjs.com/release/ember.debug.js"></script>
<script src="https://builds.emberjs.com/beta/ember-data.js"></script>
</head>
<body>
<!-- Your JavaScript -->
<script type="text/x-handlebars">
<!-- this is default application template -->
<h1>{{App.name}}</h1>
{{outlet}}
</script>
<script type="text/javascript"> //App is the object of the Ember.Application
//create() is the constructor of the Ember.Application
App = Ember.Application.create();
//App.name is the variable that holds the string values
App.name= "Hello... Welcome to TutorialsPoint";
</script>
</body>
</html>代码中的注释是自解释的。代码的一些更多细节如下:App.name是一个变量,它保存要使用Handlebars在Web浏览器上显示的String值。输出让我们执行以下步骤,看看上面的代码如何工作:将上面的代码保存在hello_emberjs.html文件中在浏览器中打开此HTML文件。