使用vue腳手架快速創建vue項目(入門)

1.安裝環境

為了方便，以下操作大多數中命令行中運行，window可以用cmd,powershell,gitbash等。

• 安裝node.js
  打開它的官網，或者中文網站，然后直接下載就可以了，然后跟安裝普通的應用一樣，直接安裝就好了。
• 查看node和npm的版本
  直接用命令行分別運行下邊命令，出現如圖，就說明安裝完成

node -v
npm -v

npm的服務器在國外，為了方便，建設安裝cnpm

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

• 安裝vue-cli
  打開它的官網，可以快速地安裝，直接運行下邊命令。如果是mac或者linux，因為有參數-g，所以在命令前加上sudo 或使用su安裝

cnpm install -g @vue/cli
或
npm install -g @vue/cli

2.搭建項目

• 創建一個文件夾，用來存放我們的所有項目，也就是你的工作空間，這個路徑完全自定義，隨便一個文件夾都行，然后使用命令行進入到這個文件夾下。在windows下，可以按住shift，然后點擊鼠標右鍵，就可以打開

• 使用腳手架創建項目,運行下邊命令, 后邊的//是注釋，復制命令時不要復制

vue create vuecli-demo  //vuecli-demo是你的項目名,這句命令執行時會有一些選擇項，不用管，一直回車，這些具體的設置項在vue cli的官網都有說明

這個命令執行完成后，會在你的工作空間中創建一個名為vuecli-demo的文件夾，里邊就是你的項目
如果這個命令長時間卡住不動時，按ctrl+c取消，然后刪除 剛才創建的這個文件夾，重新執行上邊命令

• 然后它會給你兩個命令，依次執行圖中這兩個命令
  
  這時會編譯你的項目，然后自動啟動服務。
  

最后在瀏覽器中打開
http://localhost:8080/