什麼是Vue？
首先了解一下Vue，這裏引用官方的介紹：
Vue (讀音 /vjuː/，類似於 view) 是一套用於構建用戶界面的漸進式框架。與其它大型框架不同的是，Vue 被設計爲可以自底向上逐層應用。Vue 的核心庫只關注視圖層，不僅易於上手，還便於與第三方庫或既有項目整合。另一方面，當與現代化的工具鏈以及各種支持類庫結合使用時，Vue 也完全能夠爲複雜的單頁應用提供驅動。
這段話專業水平有點略高，總之我前端小白是不能太理解的。我基本上把她理解爲一個封裝了底層JS實現，提供傻瓜式操作的前端框架。也確實如此，使用Vue，我能感覺得到她的方便之處。她可以讓一個後臺開發人員獨立開發一套界面出來（當然，沒有前端基礎，開發出來的界面肯定沒有前端工程師的精彩，也僅僅能用於日常，比如我所要開發的個人博客)，大家可以自行體會。但實際上Vue並不建議沒有前端基礎的人使用，雖然我也想使用HTML+JS+CSS開發一套前端。但學習成本實在太高，目前有心而無力，只能採用這種框架來實現。但在使用Vue的過程中，我會盡力學習學習前端的知識，也當作一次提升的過程。
安裝前準備
Vue官方提供有多種安裝方式，可以用於不同的場景，可以參考下列文檔。
可以根據自己的需求選擇不同的方式。我推薦使用NPM安裝。本項目也將採用此種方式進行安裝。
使用NPM安裝需要做以下準備：
- Node.Js環境（主要使用NPM包管理器，蓋房子需要的各種材料搬運工）
- Vue-cli 腳手架構建工具（就是一個vue項目的構建工具，蓋房子需要的地基）
一、安裝NodeJS
想要使用NPM，就需要安裝NodeJS。下載鏈接：NodeJS官網。 按照自己的電腦配置進行下載。由於我這裏之前有過安裝，因此便跳過這個步驟。還未安裝的用戶可以參考這篇文章。Node.js 安裝配置
二、設置NPM源爲國內鏡像（非必須）
在國內使用NPM源速度實在感人，如果下載速度太慢，可以考慮將NPM源更換爲淘寶NPM鏡像（注：也可以將NPM更換爲CNPM，想要更換的用戶可以查看淘寶NPM鏡像的使用說明進行更換）
將NPM源更換爲淘寶鏡像的命令
npm config set registry https://registry.npm.taobao.org
修改完成之後，使用下列命令測試
npm config get registry
更改完成圖示：
三、安裝Vue-cli腳手架（npm全局安裝）
Vue-cli是一個Vue官方快速構建項目的腳手架，截止目前已經是3.x版本。官網地址Vue-CLI腳手架
- 在命令行運行安裝命令（-g代表全局安裝），等待安裝完成。
3.x安裝命令
npm install -g @vue-cli
2.x安裝命令，按照個人需求來選擇
npm install -g vue-cli
- 查看是否安裝成功（V一定要大寫）
vue -V
如圖所示，則代表Vue安裝完成
自動創建Vue項目（使用3.x的可視化創建）
本帖採用Vue-cli 3.x版本的可視化進行創建，如果是2.x版本，可以參考Vue的三種方式安裝。這篇文章是以2.x版本爲基礎進行安裝的。
使用可視化創建Vue項目步驟：
1. 使用命令行啓動可視化程序
vue ui
啓動之後會在端口8000上生成一個配置界面（如端口被佔用，請先關閉佔用端口的程序，具體關閉教程可以百度查找）。啓動後的界面如下圖所示：
2. 選擇“創建”，在這裏進行Vue項目的創建。當前是在 E:\Project\vue 目錄下進行創建，可以自行選擇創建目錄。
3. 確定好項目目錄後，點擊“在此創建新項目“，之後按照提示填寫項目信息即可。![qwe]()
項目文件夾可以起自己的項目名稱
包管理器選擇自己想要的包管理。我這裏使用NPM進行三方包的管理
其他選項默認即可
4. 點擊“下一步”後，需要配置插件和配置，這裏根據個人需要進行配置即可。【注：項目創建完成之後也可以添加配置】
下面是我的選擇，可以參考一下。
5. 插件配置，配置完成之後點擊“創建項目”即可
6. 安裝好的項目如圖所示
7. 使用開發工具打開安裝好的項目，即可開始進行愉快的敲代碼了！
輸入以下命令啓動熱編譯開發環境
npm run serve
如圖所示，項目發佈在端口8080下，現在我們就去看看吧！
至此，使用vue-cli 3.x 構建vue項目已經結束。