Mac下安裝和配置Vue項目


題記:學vue有一段時間了,終於今天下定決心每日書寫一篇學習筆記。
1.訪問node.js官網:https://nodejs.org/en/ 下載對應安裝包。

2.安裝完成,在終端輸入 :

node -v

 

如果返回版本號,代表安裝成功。建議安裝之前給目錄權限,至於怎么給目錄權限,這里不做說明,網上有很多資料。

3.安裝淘寶鏡像
至於為何要安裝淘寶鏡像,因為有帳幕阻擋我們訪問npm 的境外網站;好奇心強的朋友可以進行嘗試,運氣差的要很久、很久、有可能一晚上時間,別問我怎么知道的。
廢話少說,在終端輸入:

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

 

安裝完成輸入:

npm -v

 

查看版本號,正確返回代表安裝完成,否在重新來過。

4.安裝webpack
以后我們會和webpack打很長時間的交道,創建項目會用到。在終端輸入:

cnpm install webpack -g

 

5.安裝vue腳手架
這個工具是自動搭建vue項目框架的工具,還算好用,沒得選只此一家。
終端輸入:

sudo npm install -g vue-cli

 

6.等待一段時間,可以去聽首歌《福建如你》,這首歌不錯,趙照的;咳咳,又跑題了,安裝完成后,在終端輸入:

vue list

 

查看詳細信息,返回如下代表成功,否,重來。


創建首個vue項目

1.在Mac中創建文件夾,名稱自己起,然后在終端打開該目錄,也可以用vscode 打開,在終端輸入:

sudo vue init webpack vue_project

 


坐等安裝完成。
2.安裝成功后切換到在終端中切換到項目根目錄

cd vue_peoject

 

3.安裝項目依賴,在終端中輸入:

sudo npm install

 

4.安裝依賴完成后,啟動項目,在終端或者vscode終端輸入:

npm run dev

 

5.訪問http://localhsot:8080,打開vue項目
題外話,相信看到這里,vue項目已經可以正常運行了。大家也有注意到,我基本會用sudo ,為啥呢?在Mac和烏班圖下,文件權限很是讓人頭痛,不加這個命令,會出現各種莫名的問題,為了減少麻煩,當然,我是個懶人,索性都加上,確保萬無一失。


免責聲明!

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



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