Vue是漸進式框架，作者尤雨溪，現就職于阿里巴巴。
個人覺得和微信小程序有點相似，只不過微信小程序已經搭建好環境了，而Vue需要自己搭建開發環境。
共同點為：（概括的不夠準確，但是差不多這些個共同點）
1.數據綁定
2.有自己特殊的組件模板
3.和HTML+CSS + JS混合用

搭建環境前先了解Vue。
Vue.js基于Node.js，Vue項目中的.vue文件不能直接被瀏覽器解析，需要轉為.js文件。一般管理Node.js的工具為npm，網絡上有npm使用的教程。
安裝環境的步驟：
1.安裝node.js
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
檢測是否安裝成功：brew -v
如圖：

圖片.png

2.安裝npm
首先獲取node的安裝模塊的權限
sudo chmod -R 777 /usr/local/lib/node_modules/
然后安裝npm淘寶鏡像
npm install -g cnpm --registry=https://registry.npm.taobao.org
檢測是否安裝npm成功：
npm -v
如圖：

圖片.png

3.安裝webpack(全局安裝)
npm install webpack -g 如果安裝卡住了，或者安裝不上，可以嘗試：cnpm install webpack -g

4.安裝vue手腳架（全局安裝，比如vue模板等）
npm install vue-cli -g

到此為止，Vue項目的前期環境就算是配好了。接下來就是創建Vue項目了。
5.創建Vue工程
首先，cd到工程目錄下面
操作步驟為，在本地創建一個空文件夾，用來存放Vue項目，比如mydemo這個文件夾,例如：
cd /Users/luoxiaoyou/Desktop/MyDemo
然后，創建Vue工程
vue init webpack myprojectName
6.會彈出來很多選項，可以直接敲enter鍵，選擇默認
如圖：在執行完之后，就會在電腦上創建一個lxy123的項目

圖片.png

7.安裝Vue的模塊
重新CD到工程目錄README文件的上一層目錄，然后執行安裝Vue操作

圖片.png

cd lxy123 然后執行 npm install 注：執行完這個工程目錄下面會多出一個文件夾node_modules，其實執行這個之后，就不用再單獨執行安裝第八步驟中的路由和請求木塊。因為 npm install 是安裝了package.json所有的模塊

npm install 表示安裝package.json文件中的模塊，一般創建新項目的時候我們會直接執行這個操作
npm install

但是當我們后續需要添加一些別的依賴或者框架的時候，就可以執行
npm install vue-resource --save
說明：vue-resource是一個依賴的名稱

8.安裝Vue請求模塊(可以根據自己的需求選擇是否執行這個步驟來安裝需要的框架、模塊)
npm install vue-resource --save 或者 cnpm install vue-resource

圖片.png

圖片.png

npm install 和 npm install --save ，npm install --save-dev的區別
使用 --save-dev 安裝的 插件，被寫入到 devDependencies 域里面去，而使用 --save 安裝的插件，則是被寫入到 dependencies 區塊里面去。
那 package.json 文件里面的 devDependencies 和 dependencies 對象有什么區別呢？
devDependencies 里面的插件只用于開發環境，不用于生產環境，dependencies 是需要發布到生產環境的。比如我們寫一個項目要依賴于jQuery，沒有這個包的依賴運行就會報錯，這時候就把這個依賴寫入dependencies ；而我們使用的一些構建工具比如glup、webpack這些只是在開發中使用的包，上線以后就和他們沒關系了，所以將它寫入devDependencies。

圖中開發和生產標注錯了！！！！！！

圖片.png

cnpm和npm的區別：
cnpm是安裝的引用文件
npm安裝是將文件下載到本地

PS：在經歷了前4步之后，我發現，其實可以省略幾個步驟
可以省略： npm install --save

圖片.png

圖片.png