angular4——安裝


本文同樣適用於NG4,最近開始學ng2了,前端小白一枚啊,做過安卓開發,做過java寫的服務器啊,熱愛前端啊,所以就開坑了,入坑之前建議先學下es6哦,學完后看下typescript哦,正所謂,前面基礎不牢固,后面都是徒勞,還是花點時間學哦,不要跳哦

ng2環境配置+創建工程+一些可能你們母雞的點

一、安裝最新環境

為什么是最新環境,按照官方文檔嗦的,反正安裝最新的避免如很多坑吧。

去nodejs的官網下載node xxx.msi,樓主使用的機子是window機子哦,mac我母雞哇。

下載完成后安裝,可以不放C盤,也建議不要放C盤,然后后面就默認吧~

安裝完成后 ctrl+r -> cmd ->進入cmd命令面板

輸入

node -v
npm -v

然后成功顯示如下,就證明你環境裝成功啦。

這時候輸入

path

能看到機子的環境變量,經過上面的兩行,系統會自動吧node和npm的環境變量加進去~為什么將這個,為的是,假如!你遇到坑了,沒辦法了,要卸載node 和npm了,這個環境變量可以看出你卸載干凈沒,我們都知道,不卸載干凈,啥子錯都能有。

二、安裝angular環境

首先安裝TS的

npm install -g typescript typings

為啥安裝它,ng2使用的開發語言是TS

接着安裝angular-cli,按照官方文檔嗦的,這是個工具,能夠幫你快速創建ng2的工程,做個工程空架子吧,可以省很多事,這里,不建議使用cnpm,有人問,cnpm是啥子?

簡單來說,就是為了方便中國開發者那啥的,你們懂得,淘寶做的一個鏈路,但是呢,下載的文件目錄還有什么坑啊會一並出現,反正,使用npm是慢了很多,然鵝,沒遇到什么坑呀~

npm install -g @angular/cli   

如果還是想用cnpm的話,可以走如下步驟

npm i -g cnpm
|cnpm i -g @angular/cli

樓主有話說:第一次用npm下載是慢了點,但是樓主發現,創建的工程是可以重復利用的,為啥這么說?有兩種方式,一種就是你在new工程的時候,會卡頓安裝工程所需要的那個文件:node_models這個文件,蠻久的吧,要是每次創建工程都要等辣么久不是很生氣嗎~可以直接跳過安卓node_models這步,復制以前創建的工程的node——moelds文件,這是大漠窮秋老師的方法,另外一個呢,我可能比較懶,直接整個工程賦值了,改了一下名字也可以使用哈

三、angular-cli的使用

cd到你想創建工程的文件目錄里去

ng new 項目名 

然后就像上面嗦的,你可以選擇等待,也可以選擇復制,隨你~

如果選擇cmpn,那么創建工程完后需要

cnpm install //來安裝依賴包

創建完工程后,那就是啟動工程

cd angularProject 
ng serve(默認端口4200) --port 4201 可是設置啟動端口
ng server --port 4201 --open 從4201端口自動在瀏覽器打開

然后在瀏覽器輸入默認的端口或者你設置的端口,就可以看到效果啦

四、一些有的沒得

npm uninstall -g @angular/cli //卸載angular-cli

反正后面要有坑,實在沒辦法了,要重新裝一下了,用這個命令,或者這樣

npm cache clearn

然后這里貼大漠窮秋老師的一個點造福道友哈哈哈

npm config list 
npm config set proxy = ""
npm delete proxy

 

后面陸續更博(╯3╰),不才,請笑納,有錯誤請指點

 


更新:20171109

項目啟動

ng server --open //自動打開瀏覽器並訪問http://localhost:4200/

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM