vue是一款構(gòu)建用戶界面的漸進(jìn)式框架，他是一款基于MVVM的框架，說到這里，簡(jiǎn)單說一下我們?cè)谠O(shè)計(jì)軟件的時(shí)候的思想，設(shè)計(jì)軟件的時(shí)候是基于MVC的架構(gòu)；

首先 M: Model：可以簡(jiǎn)單的理解為就是我的data中return回來的數(shù)據(jù)，v: view:是我的視圖層，可以理解為我的template， 而c：controller 可以理解為methods，就是將我的Model與view聯(lián)系起來，這就是基于vue對(duì)mvc的理解；

首先 ，我們?cè)陔娔X安裝vue的環(huán)境配置：(基于vue-cli去搭建項(xiàng)目)

1.在電腦安裝node，node官網(wǎng)地址： nodejs.org/zh-cn/ 直接傻瓜式安裝操作；（檢查是否安裝成功： node -v;）

2.檢查npm是否安裝成功

3.然后全局安裝vue-cil：npm install -g vue-cli（考慮到使用npm比較慢，大家可以安裝淘寶鏡像cnpm） npm install cnpm -g

cnpm install -g vue-cli

如果不小心安裝錯(cuò)誤，使用 npm cache clean來清理緩存，注意安裝失敗后，建議清楚緩存之后，再重新安裝；

4.安裝完成之后，使用vue -V 來檢查啊是否安裝成功；

5.進(jìn)入你要?jiǎng)?chuàng)建項(xiàng)目的文件夾，在這個(gè)文件夾下面輸入：

6.回車，接下來出現(xiàn)的英文表示：

Project Name：要?jiǎng)?chuàng)建的項(xiàng)目名稱（該命令會(huì)生產(chǎn)一個(gè)package.json文件，文件中的name選項(xiàng)就是這個(gè)ProjectName，默認(rèn)為當(dāng)前創(chuàng)建的項(xiàng)目目錄名稱，也可以自行制定（但是需要符合package.json中name命名規(guī)則，不要出現(xiàn)大寫字母，空格，下劃線，可以使用 - ）

Project Description：項(xiàng)目簡(jiǎn)介，也會(huì)出現(xiàn)在package.json文件中,可選

Author：作者，可選

下一步直接回車

Install vue-router：是否安裝vue路由組件，做項(xiàng)目的話一定要安裝

Use ESLint to lint your code：是否需要使用ESLint模塊進(jìn)行代碼檢測(cè)

Setup unit tests with Karma + Mocha?：是否安裝測(cè)試（單元測(cè)試）

Setup e2e tests with Nightwatch?：是否安裝端到端的測(cè)試

完成上面步驟，over！

這就是一個(gè)簡(jiǎn)單的使用vue-cli搭建一個(gè)工程的例子；

下面就是利用vue-cli搭建的項(xiàng)目目錄：

---------------------------我是華麗麗的分割線----------------------------------------------------------

總結(jié)

以上是生活随笔為你收集整理的小菜鸟vue入坑指南的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。