手把手教你搭建 vue 環境


第一步 node環境安裝

1.1 如果本機沒有安裝node運行環境,請下載node 安裝包進行安裝
1.2 如果本機已經安裝node的運行換,請更新至最新的node 版本
下載地址:https://nodejs.org/en/ 或者 http://nodejs.cn/

 

第二步 vue-cli腳手架安裝

2.1 如果訪問外網比較慢,可以使用淘寶的鏡像 https://npm.taobao.org/
打開命令終端 npm install -g cnpm --registry=https://registry.npm.taobao.org
回車之后,我就可以可以快樂的用 cnpm 替代 npm

看到這樣

恭喜你,你已經成功安裝了 cnpm
但是此后,我們還是使用 npm 來運行命令

 

問題:

npm WARN deprecated socks@1.1.10: If using 2.x branch, please upgrade to at least 2.1.6 to avoid a serious bug with socket data flow and an import issue introduced in 2.1.0

解決方案

降低npm版本

npm install npm@4.6.1 -g

 

2.2 接下來就是重點了 安裝vue-cli
npm install vue-cli -g

如果你很幸運,那么接下來就是這樣的

我們成功了

 

2.3 進入我們的項目目錄,右鍵 Gti Bash Here
2.4 初始化項目 vue init webpack vue-demo

一直回車直到

是否要安裝 vue-router 項目中肯定要使用到 所以 y 回車

是否需要 js 語法檢測 目前我們不需要 所以 n 回車

是否安裝 單元測試工具 目前我們不需要 所以 n 回車

是否需要 端到端測試工具 目前我們不需要 所以 n 回車

接下來 ctr+c 結束

2.5 進入 cd vue-demo

2.6 執行 npm install

如果出現下圖,說明安裝成功

2.7 接下來執行 npm run dev

默認瀏覽器會自動打開

注意:如果您的瀏覽器是ie9以下的版本,請升級瀏覽器到最新版本或者下載谷歌瀏覽器或者火狐瀏覽器進行預覽。在地址欄輸入 http://localhost:8080/#/進行訪問

恭喜,你已經成功安裝,並運行起來vue基礎項目,踏入了vue的大門。


免責聲明!

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



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