題記:學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和烏班圖下,文件權限很是讓人頭痛,不加這個命令,會出現各種莫名的問題,為了減少麻煩,當然,我是個懶人,索性都加上,確保萬無一失。