Vue.js是一套構建使用者介面的漸進式框架。與其他重量級框架不同的是，Vue 採用自底向上增量開發的設計。Vue 的核心庫只關注檢視層，並且非常容易學習，非常容易與其它庫或已有專案整合。另一方面，Vue 完全有能力驅動採用單檔案元件和Vue生態系統支援的庫開發的複雜單頁應用。

    首先vue.js的作者是中國人，所以說他是國產的，吸收了google的angular.js和facebook的react.js的特性，摒棄了jquery傳統的DOM操作，採用資料繫結和指令等概念，可以說是未來WEB端開發的趨勢，但是也並不代表jquey就淘汰了，存在即合理，jq應該在以後會有其他領域的價值，這裡我就不多說了。

    說了這麼多，我們還是開始怎麼搭建vue.js的環境吧。首先要搭建vue的環境需要藉助node.js的npm的包管理器。這個npm我就不詳細介紹了，網上自己去百度，反正後面要安裝的一系列的依賴或者包都要用到這個。

    一、node.js的安裝

    node.js近幾年很火熱，開始我以為是一門語言，其實只是一個平臺，他封裝了chorme v8的引擎，可以直接用js作為伺服器端指令碼語言。http://nodejs.cn/進去該網站下載最新版本的node,

　　注意npm版本是3.8以上的就行。後面就是下一步下一步的安裝就可以了。安裝完成後，wind+r  彈出cmd，輸入node -v 和 npm -v  分別檢視版本號，代表node.js安裝完成。說到這裡博主我遇到過問題了。

    因為我電腦我安裝過appcan-v3.3,這款IDE封裝了node.js並且裝的時候把node.js的環境變數給配好了，以至於我後來新裝的node.js檢視版本號都是低版本的。解決方法其實很簡單，開啟我的電腦檢視屬性/高階系統設定/環境變數。然後找到"appcan_path"點選編輯,把“F:\set-soft\AppCanStudioPersonalV3.3\HDK\emulator\mas\”全都刪除，然後重新檢視版本。v3.10.4的npm即可。（也可以設定全域性資料夾，直接採用預設的，那node會全都裝在根目錄下的node_modules，目前裡面只有npm就對了，tips:如果你第一次設定了全域性資料夾並且解除安裝了node,那麼你後面再重新安裝node.js還會有這個設定，我是沒管，具體解決方案可以百度）

    二、node.js的環境變數的新建。

    其實安裝完node，就自動在path裡增加環境變數，但是為了以後的本地部署專案，我們需要找到node.js的安裝根目錄，在當中新建“node_global”和"node_cache"兩個資料夾。

    1、啟動CMD依次執行以下兩條命令
npm config set prefix "F:\set-soft\nodejs\node_global"
npm config set cache "F:\set-soft\nodejs\node_cache"

2、設定環境變數：
NODE_PATH = F:\set-soft\Node\nodejs
PATH = %NODE_PATH%\;%NODE_PATH%\node_modules;%NODE_PATH%\node_global;

這樣就可以把後面全域性安裝的裝到global裡並且可以直接用命令使用。

三、安裝淘寶的npm映象：

    輸入

$ npm install -g cnpm --registry=https://registry.npm.taobao.org，即可安裝npm映象，以後再用到npm的地方直接用cnpm來代替就好了。這個其實看個人愛好吧，因為npm在國內下載速度是很慢，所以就用npm下載安裝cnpm可以更快的下載後面的依賴等等。

四、安裝全域性vue-cli腳手架、webpack.

    命令輸入

　　1.(npm)cnpm install -g vue-cli                       //全域性安裝vue-cli

    2.(npm)cnpm install -g webpack                          //全域性安裝webpack

    (npm)npm install -g webpack-dev-server             //安裝webpack的本地webserver

　　安裝完成後，vue-cli腳手架其實就已經把vue也裝掉了，所以只需輸入vue -V 和 webpack -v  等等就可以檢視安裝成功與否。

五，新建vue.js專案

    新建的話，可以在當前系統盤下直接新建，也可以切換碟符，然後在當前的磁盤裡新建檔案專案

命令 vue init webpack vue_project(最後這個是我建立的專案資料夾的名字)

　　看到上面的就代表已經完成，然後就去當前的磁盤裡找到“my_test”你的專案資料夾，裡面使用了腳手架vue-cli的和webpack提供的模板進行了建立。目錄結構大概是這樣

六、本地安裝和執行專案

1.注意前面的碟符是當前的，然後命令cd my_test     //進入資料夾

..回車輸入  cnpm install   你會發現在已經建立的專案結構裡面會多出一個node_modules的資料夾，裡面就是剛才安裝的所有依賴。

2.準備工作做好以後，測試一下專案裡面預設的app.vue模組能否跑起來，這是需要先安裝一下伺服器環境，在命令列中輸入 
cnpm run dev 回車即可 

8080就是預設的埠，在瀏覽器位址列中輸入localhost:8080會發現預設的模組打開了！

(這裡博主我又遇到過問題，就是我的8080埠被佔用了，解決方法是，cmd命令輸入netstat -ano找到8080埠的PID，然後開啟“人物管理器”，找到對應的PID，將該程序給關了即可，我的是svn服務端軟體給佔了。)

最後開啟瀏覽器:127.0.0.1:8080出現下面這個就代表vue.js在本地就建立好了。

七、執行別人的vue.js專案domo

可以從github上克隆下來，然後將專案資料夾放到某個碟符下，然後cmd命令 找到該碟符，比如 f:

f:\cd domo_vue

命令 cnpm(npm) install    //在本地安裝

最後  cnpm(npm) run dev   回車   //在本地的瀏覽器開啟127.0.0.1帶上埠號就可以跑起來了。

八、伺服器端執行

 npm run build   

會生成靜態檔案，在根目錄的dist裡，裡面有個index.html，這是伺服器訪問的路徑指定到這裡就可以訪問我們自己的專案了。但是我發現個問題就是生成index.html裡引用的css和js的引用路徑不對，這時候就需要自己修改一下配置了。

進入config/index.js

原來的配置的引用路徑為

最後整個vue.js專案就可搭建完成。