首先，要到node官網下載並安裝好node.js，安裝過程很是簡單，一直「next」就能夠了。我這裏下載的是8.11.2的版本前端
而後，在菜單欄打出"cmd",就會彈出命令行窗口，以下圖所示vue
輸入命令 node -v 若是有顯示你下載的版本就表明你的node.js安裝成功了node
node的環境已經安裝好了，如今咱們要安裝淘寶鏡像了。爲何要安裝淘寶鏡像呢？還不是由於快、穩定！webpack
安裝淘寶鏡像步驟web
在命令行輸入：vue-router
npm install -g cnpm -registry=https://registry.npm.taobao.orgvue-cli
而後就是等待，安裝完成就是下圖的樣子npm
接着安裝vue-cli腳手架構建工具瀏覽器
vue-cli提供一個官方命令行工具，可用於快速搭建大型單頁應用。該工具提供開箱即用的構建工具配置，帶來現代化的前端流程。只須要幾分鐘便可建立並啓動一個帶熱重載、保持時靜態檢查以及可用於生產環境的構建配置的項目。架構
輸入命令行：
npm install vue-cli -g
安裝完成以下圖
建立一個基於webpack模板的新項目
首先，咱們要建立項目，要選定目錄，而後在命令行中把目錄轉到選定的目錄。可使用：
my-project爲自定義項目名
vue init wepack + 項目名（不能出現中文）
以下圖：
回車後，會出現下面這些東西
注意：項目名稱不能爲大寫，否則會報錯
Project name my project # 項目名稱 個人項目
Project description A Vue.js project # 項目描述一個Vue.js項目
Author 做者（你的名字）
Vue build standalone # vue 構建獨立
Insatll vue-router?(y/n) # 是否安裝vue 路由 ( y [ yes ] / n [ no ] )
Use ESLint to lint your code?(y/n) # 使用ESLint 到你的代碼？( y [ yes ] / n [ no ] )
Set up unit tests (y/n) # 設置單元測試？ ( y [ yes ] / n [ no ] )
Setup e2e tests with Nightwatch?(y/n) # 用Nightwatch設置e2e測試 ？( y [ yes ] / n [ no ] )
你想選yes 仍是no，就看你我的狀況了。我這裏除了路由選了是，其餘都是no
回車加載完成，以下圖
初始化一個項目，進入你這個項目的目錄
cd my-project
npm install 初始化
運行項目讓它跑起來！
輸入命令：
npm run dev
只要出現下面這些就成功了
而後在瀏覽器打開一個新的窗口，輸入 http://localhost:8080 就能夠了！
出現下面這個頁面就表明你配置成功了
這是我第一次寫教程，可能有的地方寫的很差，請多多指教。在這裏我想補充一下， -g 是全局安裝。