初學者AngularJS的環(huán)境搭建過程
AngularJS是什么?
AngularJS是一個開源Web應用程序框架。它最初是由MISKO Hevery和Adam Abrons于2009年開發(fā)?，F(xiàn)在是由谷歌維護
AngularJS特性
AngularJS是一個功能強大的基于JavaScript開發(fā)框架用于創(chuàng)建富互聯(lián)網應用(RIA)。
AngulajJS為開發(fā)者提供的選項(使用JavaScript)在一個干凈的MVC(模型 - 視圖 - 控制器)的方式來編寫客戶端應用程序。
AngularJS寫的應用都是跨瀏覽器兼容。AngularJS使用JavaScript代碼自動處理適應每種瀏覽器。
AngularJS是開源的，完全免費的，并且由數(shù)千名世界各地的開發(fā)者開發(fā)維護。它是根據Apache許可證2.0版許可發(fā)布。
總體來說，AngularJS是一個用來構建大型應用，高性能的Web應用程序的框架，同時使它們易于維護。
一 、在這里簡單介紹一下Angular-cli的特性：
Angular-cli可以快速搭建框架，創(chuàng)建module，service，class，directive等；
有webpack的功能，可以實現(xiàn)代碼分隔、按需加載等；
自動配置開發(fā)環(huán)境、測試環(huán)境、生產環(huán)境，可以實現(xiàn)代碼的打包壓縮和熱部署，還可以實現(xiàn)模塊測試、端到端測試
Angular-cli可以通過后綴自動識別sass、less的預編譯；
Angular-cli可以在創(chuàng)建的時候進行TypeScript的配置，還可以做一些個性化配置；
通過Angular-cli創(chuàng)建的工程結構是最佳實踐，可以用于生產環(huán)境；
二、安裝nodejs
AngularJS需要用到Nodejs，所以我們需要先安裝nodejs，需要用到nodejs，nodejs的下載地址是：https://nodejs.org/en/download/，
三、安裝npm和cnpm
下一步是安裝npm，
NPM是隨同NodeJS一起安裝的包管理工具，能解決NodeJS代碼部署上的很多問題，常見的使用場景有以下幾種：
允許用戶從NPM服務器下載別人編寫的第三方包到本地使用。
允許用戶從NPM服務器下載并安裝別人編寫的命令行程序到本地使用。
允許用戶將自己編寫的包或命令行程序上傳到NPM服務器供別人使用。
到這里已經完成了nodejs和npm的安裝，不過在大天朝內用npm安裝的話會有一些問題，所以我們用cnpm安裝，cnpm也是npm的一個包。
安裝cnpm，執(zhí)行命令
npm i -g cnpm
執(zhí)行這個命令之后，等待完成，然后輸入cnpm version查看是否安裝完成，這里我已經安裝過了，所以可以進去了。
安裝完成cnpm之后，我們開始安裝Angular-cli。
執(zhí)行命令
cnpm i -g angular-cli
然后可以執(zhí)行ng version命令，查看是否安裝完成和angular-cli的版本
安裝完成之后我們就可以使用ng命令，下面開始創(chuàng)建項目。
四、項目創(chuàng)建
安裝完成angular-cli之后就可以直接創(chuàng)建項目了，執(zhí)行命令
ng new JustForTest
其中JustForTest是項目名稱
執(zhí)行這個命令是創(chuàng)建很多文件，而且需要等待一下，這個步驟會等很久,需要等到nod_.modules的安裝完成
直接使用ng serve啟動。
這樣就可以直接啟動項目，我們在瀏覽器中輸入：http://localhost:4200可以直接訪問：
五、在導入項目
如果是從網上找項目，我們怎么在本地啟動呢？下面我們具體操作一下：
推薦大家去看一下大漠老師的這個教程：Angular2.0視頻教程來了
，在這里演示我們也是用大漠老師的一個項目：NiceFish，首先我們需要通過git將項目clone下來，這里就不演示這個了，這是NiceFish的項目地址：http://git.oschina.net/mumu-osc/NiceFish
項目clone下來之后，命令行進入項目所在目錄。
執(zhí)行命令
cnpm i -g @angular/cli
這里說明一下，之前我們安裝的是全局的angular-cli。
等待命令執(zhí)行完成，之后再執(zhí)行命令
cnpm install
然后執(zhí)行命令
ng serve -prod -aot
然后等待編譯完成。
完成之后，我們就可以在瀏覽器中輸入：
http://localhost:4200 訪問項目。
總結
以上所述是小編給大家介紹的初學者AngularJS的環(huán)境搭建過程，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復大家的。在此也非常感謝大家對腳本之家網站的支持！
相關文章
每個Angular版本在其生命周期中都經歷了各個階段。組件在Angular中起著關鍵作用; 在這里，本文將討論Angular中的組件生命周期以及它們如何影響框架所有版本的生命周期。2021-05-05
簡介可以自動完成UI的AngularJS工具angular-smarty
這篇文章主要介紹了簡介可以自動完成UI的AngularJS工具angular-smarty,包括其中隔離作用域綁定指令符和promise的使用,需要的朋友可以參考下2015-06-06
這篇文章主要介紹了angular2模塊和共享模塊詳解,小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-04-04
這篇文章主要介紹了AngularJS中取消對HTML片段轉義的方法例子,在一些需要顯示HTML的地方,就要取消AngularJS的轉義,本文就介紹了這種方法,需要的朋友可以參考下2015-01-01
這篇文章主要介紹了Angular 組件之間的交互的示例代碼，根據數(shù)據的傳遞方向，分為父組件向子組件傳遞、子組件向父組件傳遞及通過服務傳遞三種交互方法。非常具有實用價值，需要的朋友可以參考下2018-03-03
angularjs中控制視圖的控制器的兩種注入依賴項及服務的寫法小結
在AngularJS中,控制器的依賴注入有兩種方法：顯式依賴注入和隱匿依賴注入,顯式依賴注入通過使用字符串數(shù)組形式來注入依賴項,本文給大家介紹angularjs中控制視圖的控制器的兩種注入依賴項及服務的寫法,感興趣的朋友一起看看吧2024-09-09
Angular實現(xiàn)點擊按鈕后在上方顯示輸入內容的方法
這篇文章主要介紹了Angular實現(xiàn)點擊按鈕后在上方顯示輸入內容的方法,涉及AngularJS事件響應及頁面元素屬性動態(tài)設置相關操作技巧,需要的朋友可以參考下2017-12-12
這篇文章主要為大家詳細介紹了angularjs下拉框空白的解決方法，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-06-06
AngularJS實現(xiàn)與后臺服務器進行交互的示例講解
今天小編就為大家分享一篇AngularJS實現(xiàn)與后臺服務器進行交互的示例講解，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-08-08
本文給大家介紹angularjs 隱藏和顯示，對angularjs 隱藏和顯示相關知識感興趣的朋友一起學習吧2015-12-12