介紹

Vue.js是一套構建用戶界面的漸進式框架。
Vue 只關註視圖層，采用自底向上增量開發的設計。
Vue 的目標是通過盡可能簡單的 API 實現響應的數據綁定和組合的視圖組件。

第一步：安裝node.js

從node.js官網下載並安裝node，安裝步驟就是一路點next即可~

安裝完成後輸入cmd打開命令行工具輸入命令node -v，出現版本號說明node安裝成功啦。

後面我們安裝其他依賴時都要通過npm進行安裝，但是由於npm的有些資源被墻，為了更快更穩定,所以我們需要切換到淘寶的npm鏡像——cnpm。

安裝cnpm

在命令行輸入：

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

接下來等待安裝即可~

安裝完成後輸入cnpm-v查看版本：

以後的npm寫法可以用cnpm代替了。

第二步：安裝vue

cnpm install vue

安裝vue-cli腳手架

#全局安裝
cnpm install -g vue-cli

創建一個基於 webpack 模板的新項目

#my-project為自定義項目名
$ vue init webpack my-project

運行初始化命令的時候回讓用戶輸入幾個基本的選項，如項目名稱，描述，作者等信息，其中我把ESLint、tests、e2s都設為n，即不想用到這些，其他全部為y。

Project name (my-project) # 項目名稱（我的項目）

Project description (A Vue.js project) # 項目描述一個Vue.js 項目

Author 作者（你的名字）

Install vue-router? (Y/n) # 是否安裝Vue路由，也就是以後是spa（但頁面應用需要的模塊）

Use ESLint to lint your code? (Y/n) # 使用 ESLint 到你的代碼？ （Y [ yes ] / N [ no ]）

Pick an ESLint preset (Use arrow keys) # 選擇一個預置ESLint（使用箭頭鍵）

Setup unit tests with Karma + Mocha? (Y/n) # 設置單元測Karma + Mocha？ （Y/ N）

Setup e2e tests with Nightwatch? (Y/n) # 設置端到端測試，Nightwatch？ （Y/ N）
 

需要註意的是項目名字不能大寫~

安裝依賴

初始化的項目是沒有依賴的，直接運行會報錯，所以得先安裝依賴：

cnpm install

接下來運行：

cnpm run dev

或者這樣也行：

cnpm start

運行完之後出現這個頁面說明已經腳手架搭建成功啦。

Vue開篇之Vue-cli搭建項目