vue-cli基礎搭建

對vue-cli腳手架搭建的小記錄。

打開命令窗口

vue-cli腳手架的搭建前須要安裝node環境

一、首先檢查node是否存在

node -v
複製代碼

若是存在就能夠繼續安裝，若是不存在須要自行安裝node

二、再次檢測此設備是否有vue的存在

vue -V
複製代碼

• 存在
  • 升級
  • 卸載重裝
• 不存在
  • 安裝

若是須要升級或從新安裝

升級

npm update vue --save
複製代碼

卸載從新安裝

全局卸載

npm uninstall vue-cli -g;
複製代碼

檢查是否卸載

卸載成功就從新安裝

npm install vue-cli -g 
複製代碼

注：若是你使用以上命令顯示報錯，則須要安裝淘寶鏡像，由於npm服務器是在國外，國內網絡環境太慢，就會顯示報錯，就要使用淘寶鏡像安裝。

npm config set registry https://registry.npm.taobao.org
複製代碼

再次操做安裝步驟

cnpm install vue-cli -g  
複製代碼

再次檢查是否安裝成功

三、建立項目

能夠進入到本身想要創建項目的磁盤或者文件夾中建立項目

d:
cd PracticeProject
複製代碼

注：我是在D盤的PracticeProject文件夾中建立的項目。 建立一個基於"webpack"的項目,後面是項目名

vue init webpack vueCli
複製代碼

選擇合適的插件進行安裝，須要Yes 不須要No

四、進入項目目錄 並安裝項目依賴

cd PracticeProject
複製代碼

cnpm install
複製代碼

五、啓動項目

要進入項目中並啓動項目

cd vueCli
複製代碼

npm run dev
複製代碼

展現出這個頁面的時候，說明咱們的腳手架已經搭建成功。

系統默認的端口是8080，若是此端口已被佔用，能夠在項目中config/index.js對端口進行修改。