免費AI編程助手
EmberJS 環(huán)境配置
通過將JavaScript庫文件包含在HTML文件中的<script>標記中，可以輕松配置Ember.js;這可以通過以下兩種方式完成：
您可以從其官方網(wǎng)站下載最新版本的Ember.js JavaScript庫文件。
您可以從官方網(wǎng)站包括最新版本的CDN。
下載JavaScript庫
在安裝emberjs之前，它應(yīng)該要求在具有兼容瀏覽器的系統(tǒng)上安裝nodejs。在nodejs命令行界面中使用以下命令安裝emberjs：
npm install -g ember-cli
要創(chuàng)建應(yīng)用程序，請使用以下命令 -
ember new my-app
CDN來自官方網(wǎng)站
CDN或內(nèi)容傳送網(wǎng)絡(luò)是設(shè)計為向用戶提供文件的服務(wù)器網(wǎng)絡(luò)。如果您在網(wǎng)頁中使用CDN鏈接，它將托管文件的責任從您自己的服務(wù)器遷移到一系列外部服務(wù)器。這也提供了一個優(yōu)點，如果您的網(wǎng)頁的訪問者已經(jīng)從相同的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：這是一個完整的開發(fā)版本。它包括幾乎所有的包。
jQuery-2.1.3.min.js：它刪除不必要的字符，使文件大小更小。
ember.prod.js：生產(chǎn)文件刪除任何調(diào)試語句和/或斷言。它包括所有包，除了：
handlebars.min.js
ember.debug.js
handlebars.min.js：它用于有效地構(gòu)建語義模板。
ember-template-compiler.js：模板編譯器可以用于服務(wù)器端進行預(yù)編譯。
ember-data.js：它用于處理Ember數(shù)據(jù)。
在本教程程序的所有章節(jié)中，我們引用了Ember.js JavaScript庫的最新CDN。
例子
讓我們創(chuàng)建一個使用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>
代碼中的注釋是自解釋的。代碼的一些更多細節(jié)如下：
App.name是一個變量，它保存要使用Handlebars在Web瀏覽器上顯示的String值。
輸出
讓我們執(zhí)行以下步驟，看看上面的代碼如何工作：
將上面的代碼保存在hello_emberjs.html文件中
在瀏覽器中打開此HTML文件。
更多建議：