摘要：vue腳手架指的是vue-cli，它是一個(gè)專門為單頁面應(yīng)用快速搭建繁雜的腳手架，它可以輕松的創(chuàng)建新的應(yīng)用程序而且可用于自動(dòng)生成 vue 和 webpack 的項(xiàng)目模板，Vue是一個(gè)用于構(gòu)建用戶界面的漸進(jìn)式框架。它是可以自底向上逐層應(yīng)用...

在了解 vue腳手架 是什么之前，要先了解其他的一些概念：

CLI：

命令行界面（英語：command-line interface，縮寫：CLI）是在圖形用戶界面得到普及之前使用最為廣泛的用戶界面，它通常不支持鼠標(biāo)，用戶通過鍵盤輸入指令，計(jì)算機(jī)接收到指令后，予以執(zhí)行。也有人稱之為字符用戶界面（CUI）。

Node.js：

Node.js 是一個(gè)事件驅(qū)動(dòng) I/O 服務(wù)端 JavaScript 環(huán)境，基于 Google 的 V8 引擎，V8 引擎執(zhí)行 Javascript 的速度非常快，性能非常好，簡(jiǎn)單的說就是運(yùn)行在服務(wù)端的 JavaScript。

NPM:

NPM的全稱是 Node Package Manager，是一個(gè) NodeJS 包管理和分發(fā)工具，已經(jīng)成為了非官方的發(fā)布Node模塊（包）的標(biāo)準(zhǔn)，管理前端各種依賴。

設(shè)置淘寶鏡像：
npm config set registry https://registry.npm.taobao.org

驗(yàn)證鏡像
npm config get registry

設(shè)置npm默認(rèn)安裝目錄及緩存目錄
npm config set prefix "D:\nodejs\node_global"
npm config set cache "D:\nodejs\node_cache"

腳手架：

在軟件開發(fā)上（當(dāng)然也包括前端開發(fā)）的腳手架指的就是：有人幫你把這個(gè)開發(fā)過程中要用到的工具、環(huán)境都配置好了，你就可以方便地直接開始做開發(fā)，專注你的業(yè)務(wù)，而不用再花時(shí)間去配置這個(gè)開發(fā)環(huán)境，這個(gè)開發(fā)環(huán)境就是腳手架。

vue腳手架：

vue腳手架指的是vue-cli，它是一個(gè)專門為單頁面應(yīng)用快速搭建繁雜的腳手架，它可以輕松的創(chuàng)建新的應(yīng)用程序而且可用于自動(dòng)生成 vue 和 webpack 的項(xiàng)目模板。

Vue是一個(gè)用于構(gòu)建用戶界面的漸進(jìn)式框架。它是可以自底向上逐層應(yīng)用。Vue 的核心庫只關(guān)注視圖層，不僅易于上手，還便于與第三方庫或者現(xiàn)有的項(xiàng)目進(jìn)行整合。 另一方面當(dāng)與現(xiàn)代化的工具鏈以及各種支持類庫結(jié)合使用時(shí)，Vue也完全能夠?yàn)閺?fù)雜的單頁應(yīng)用提供驅(qū)動(dòng)，接下來將介紹Vue中的一個(gè)重要內(nèi)容vue-cli，就有一定的參考價(jià)值，希望對(duì)大家有所幫助。

vue腳手架的簡(jiǎn)單使用

1.安裝vue腳手架：

npm install -g vue-cli  

添加vue命令到path環(huán)境變量
我的電腦-屬性-高級(jí)系統(tǒng)設(shè)置-環(huán)境變量-path-添加：

D:\nodejs\node_global

2.通過vue腳手架創(chuàng)建一個(gè)項(xiàng)目：

vue init webpack 項(xiàng)目名

webpack: 它主要用途是通過CommonJS 的語法把所有瀏覽器端需要發(fā)布的靜態(tài)資源作相應(yīng)的準(zhǔn)備，比如資源的合并和打包。

3.運(yùn)行vue腳手架項(xiàng)目：

進(jìn)入到項(xiàng)目的根目錄，然后在項(xiàng)目根目錄執(zhí)行： 

npm start

4.訪問vue項(xiàng)目：

瀏覽器打開啟動(dòng)后的地址，如：

http://localhost:8080/

5.vue-cli項(xiàng)目打包及部署：

進(jìn)入到項(xiàng)目的根目錄，然后在項(xiàng)目根目錄執(zhí)行：

npm run build

運(yùn)行完成之后，會(huì)出現(xiàn)一個(gè) dist 目錄，這個(gè)就是打包后的文件，直接拷貝到服務(wù)器部署就可以了