Vue CLi 2.x 開發環境搭建

Vue.js做爲目前國內最火的前端開發框架之一，本文將介紹如何經過Vue-cli搭建Vue.js的前端開發框架。目前Vue-cli已經發展3.x，不過考慮不少開發依舊是在2.x框架上進行的，因此本文仍是先介紹Vue-cli 2.x框架的搭建，以後會出3.x框架的搭建教程。

1.安裝Node JS

首先須要在本機安裝NodeJS，這是Vue開發的基礎環境，Nodejs的官網： nodejs.org/en/download…，在這裏面選擇本身電腦對應的開發版本，點擊下載，安裝便可。

不過我推薦使用 Chocolate包管理器安裝Nodejs，這樣安裝NodeJS的步驟將會變得很是簡單。

2.安裝Vue-cli腳手架

在cmd（可能須要以管理員身份打開cmd安裝vue-cli）裏輸入：npm install -g vue-cli，回車，等待安裝……輸入：vue，回車，若出現vue信息說明表示成功，-g表明全局安裝（之後就能夠直接使用vue-cli腳手架了）

3.建立Vue項目

在cmd裏輸入：vue init webpack project-name(項目名)，而後會有一些參數和配置，根據本身的須要選擇填寫便可。

4.安裝項目依賴包

在項目文件夾下，使用cmd，輸入：npm install，回車，等待一小會兒（其實好久），回到項目文件夾，會發現項目結構裏，多了一個node_modules文件夾（這就是項目的依賴包），PS：這一步也能夠在生成項目時，就選擇npm install自動安裝依賴包。

5.測試環境是否搭建成功

在cmd裏輸入：npm run dev，運行項目，最後在瀏覽裏輸入項目運行的URL：localhost:8080(默認端口爲8080)。