vue.js環境配置以及執行個體運作簡明教程
聲明：本文檔編寫參考如下兩篇部落格，是對它們的修改與補充，歡迎點選連結檢視原文：
VUE.JS簡介
何為Vue.js
Vue.js（讀音 /vjuː/, 類似于 view）是一套建構使用者界面的漸進式架構。與其他重量級架構不同的是，Vue 采用自底向上增量開發的設計。Vue 的核心庫隻關注視圖層，并且非常容易學習，非常容易與其它庫或已有項目整合。另一方面，Vue 完全有能力驅動采用單檔案元件和Vue生态系統支援的庫開發的複雜單頁應用。
Vue.js 的目标是通過盡可能簡單的 API 實作響應的資料綁定群組合的視圖元件。
Vue.js是一個MVVM模式的架構，如果讀者有angular經驗，一定能夠很快入門Vue的
vue.js的作者是中國人，吸收了google的angular.js和facebook的react.js的特性，摒棄了jquery傳統的DOM操作，采用資料綁定和指令等概念，可以說是未來WEB端開發的趨勢。
vue.js的特點
易用： 已經會了HTML,CSS,JavaScript？即刻閱讀指南即可開始建構應用！
靈活： 簡單小巧的核心，漸進式技術棧，足以應付任何規模的應用。
高效： 16kb min+gzip 的運作大小,超快虛拟 DOM ,最省心的優化
VUE.JS 環境搭建
vue.js推薦開發環境
Node.js: javascript運作環境(runtime),不同系統直接運作各種程式設計語言
npm: Nodejs下的包管理器
webpack: 它主要的用途是通過 CommonJS 的文法把所有浏覽器端需要釋出的靜态資源做相應的準備，比如資源的合并和打包。
vue-cli: 使用者生成Vue工程模闆
vue.js安裝
1. 安裝node.js
到官網下載下傳node.js安裝包，安裝過程和一般軟體沒有差別。安裝完成後到終端檢視版本号，若如下圖所示，表示安裝成功。
node.js環境變量建立
其實安裝完node，就自動在path裡增加環境變量，但是為了以後的本地部署項目，我們需要找到node.js的安裝根目錄，在當中建立“node_global”和"node_cache"兩個檔案夾。
a. 啟動CMD依次執行以下兩條指令
b. 設定環境變量：
這樣就可以把後面全局安裝的裝到global裡并且可以直接用指令使用。
2. 安裝webpack
3. 安裝vue腳手架
建立vue.js項目
建立項目檔案夾，終端進入該目錄
建立的話，可以在目前系統盤下直接建立，也可以切換盤符，然後在目前的磁盤裡建立檔案項目，如下示例
根據模闆建立項目
指令 vue init webpack vue_project(最後這個是建立的項目檔案夾的名字)
工程目錄如圖
初始化完成，就到目前的磁盤裡找到你的項目檔案夾，裡面使用了腳手架vue-cli的和webpack提供的模闆進行了建立。目錄結構大概如下所示
安裝項目依賴
安裝 vue 路由子產品vue-router和網絡請求子產品vue-resource，進入該項目執行：
啟動項目
通路: http://localhost:8080/ 運作成功
運作下載下傳的Vue demo
下載下傳demo，并解壓到運作檔案中
可以從github克隆下來，然後将項目檔案夾放到某個檔案中，在終端進入該檔案目錄，比如 :
在本地安裝
運作
伺服器端運作
會生成靜态檔案，在根目錄的dist裡，裡面有個index.html，這是伺服器通路的路徑指定到這裡就可以通路我們自己的項目了。但是我發現個問題就是生成index.html裡引用的css和js的引用路徑不對，這時候就需要自己修改一下配置了。
進入config/index.js，修改配置，搭建完成。如下圖示例：
附錄
淘寶的npm鏡像安裝方法
輸入如下指令安裝npm鏡像：
以後再用到npm的地方直接用cnpm來代替就好了因為npm在國内下載下傳速度是很慢，推薦使用cnpm。
運作報錯處理
運作就報錯
原因
這是windows不支援NODE_ENV=development的設定方式
解決
安裝across-env: npm install cross-env --save-dev
在NODE_ENV=xxxxxxx前面添加cross-env就可以了。
運作還是報錯
原因
找不到webpack這個子產品
安裝該子產品:
安裝好後運作又報這個子產品的錯:
解決方法