Angular開發(fā)環(huán)境如何在windows環(huán)境下配置

Node.js

安裝

Node.js的安裝比較方便，直接去Node.js官方下載，然后按照步驟安裝下去即可

可以將其安裝在任何目錄，比如

D:\nodejs\

Node.js自帶npm，所以不用安裝

打開cmd終端，用下列命令檢查Node.js安裝是否成功：

node -v
npm -v

如果出現(xiàn)版本號，說明Node.js安裝成功

配置

配置prefix和cache

使用下列命令可以查看npm的配置

npm config ls

可以看到npm最初將下載的依賴包和緩存都放在C盤下，明顯這是不太合適的，不過可以配置這兩個目錄

npm config set prefix "D:\nodejs\node_global"
npm config set cache "D:\nodejs\node_cache"

配置環(huán)境變量

右擊“計算機(jī)”—>“屬性”—>“高級系統(tǒng)設(shè)置”—>“環(huán)境變量”

在系統(tǒng)變量中,設(shè)置NODE_PATH，值為

D:\nodejs\node_global\node_modules\

在用戶變量中,修改path，添加

D:\nodejs\node_global\

更改npm的鏡像源

由于npm的初始源是國外的，所以速度可能會有點慢

這里可以配置淘寶的鏡像cnpm，以后把npm的指令改為cnpm即可

npm install -g cnpm --registry=https://registry.npm.taobao.org

如果選了淘寶的cnmp鏡像，應(yīng)該設(shè)置一下，保證正常下載工具

ng set --global packageManager = cnpm

Typescript

執(zhí)行如下命令

npm install -g typescript typings

檢查版本號

tsc -v

Angular-cli

angular-cli它是Angular框架官方的一個構(gòu)建工具，核心是webpack，以及npm做為依賴包

執(zhí)行如下命令

npm install -g @angular-cli

檢查版本號

ng -v

創(chuàng)建項目

可以在nodejs下面創(chuàng)建一個工作空間

md D:\nodejs\workspace

然后進(jìn)入工作空間

cd D:\nodejs\workspace

新建一個項目

ng new hello-world

然后在hello-world文件夾內(nèi)啟動服務(wù)

ng serve

Angular服務(wù)默認(rèn)監(jiān)聽4200端口，打開瀏覽器，輸入

localhost:4200

或者輸入下列命令，直接打開默認(rèn)瀏覽器

ng serve --open

如果出現(xiàn)成功的頁面，說明所有配置都成功

聲明：本網(wǎng)頁內(nèi)容旨在傳播知識，若有侵權(quán)等問題請及時與本網(wǎng)聯(lián)系，我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com