本內(nèi)容為系列內(nèi)容，全部?jī)?nèi)容請(qǐng)看我的vue教程分類(lèi)
Vue CLI 是一個(gè)基于 Vue.js 進(jìn)行快速開(kāi)發(fā)的完整系統(tǒng)
終于就是到了這一節(jié)，前面多次提到的腳手架來(lái)啦！
什么是腳手架
其實(shí)就是一個(gè)配置好了的使用webpack完成打包構(gòu)建的初始化工程，和我們前面講的webpack打包沒(méi)啥區(qū)別，只是更為全面，在實(shí)際開(kāi)發(fā)中也是常用的工具
當(dāng)前最新版本為 vue-cli4 但是和 cli3區(qū)別不大所以?xún)蓚€(gè)版本都是可以使用的
全局安裝cli，確保你已經(jīng)安裝了node了哦，命令行執(zhí)行
npm i @vue/cli -g
使用命令行創(chuàng)建項(xiàng)目
使用create創(chuàng)建項(xiàng)目，命令行執(zhí)行，后面緊跟的是項(xiàng)目名，這里我起名 vueclidemo
vue create vueclidemo
開(kāi)始創(chuàng)建會(huì)有一些安裝提示，選擇默認(rèn)即可
然后進(jìn)入這個(gè)項(xiàng)目文件夾，命令行執(zhí)行
npm run serve
項(xiàng)目就運(yùn)行起來(lái)了
命令行執(zhí)行，可以完成對(duì)項(xiàng)目的打包
npm run build
使用可視化工具創(chuàng)建項(xiàng)目
命令行執(zhí)行，打開(kāi)可視化工具,這樣也能完成項(xiàng)目的創(chuàng)建
vue ui
當(dāng)然還可以在可視化管理工具里面導(dǎo)入我們的項(xiàng)目
導(dǎo)入完成后可以進(jìn)入項(xiàng)目的管理界面，我們點(diǎn)擊插件，安裝一個(gè)vuerouter的插件，也就是相當(dāng)于給當(dāng)前項(xiàng)目導(dǎo)入vuerouter
點(diǎn)擊安裝即可，完成安裝后會(huì)詢(xún)問(wèn)我們當(dāng)前路由使用的模式，默認(rèn)即可，這就完成引入了，是不是非常方便呢
并且我們打開(kāi)項(xiàng)目可以發(fā)現(xiàn)系統(tǒng)已經(jīng)默認(rèn)給我們引入并注冊(cè)了router
打開(kāi) main.js,發(fā)現(xiàn)引入了 router這個(gè)文件，并傳給了實(shí)例化的vue
然后我們打開(kāi)這個(gè) router 文件，講解一下
然后我們來(lái)到這個(gè)任務(wù)界面，運(yùn)行項(xiàng)目
項(xiàng)目就啟動(dòng)以后，點(diǎn)擊后面的 啟動(dòng) app，就來(lái)到項(xiàng)目界面
這就完成了腳手架的基本使用
可能遇到的問(wèn)題
npm速度過(guò)慢
使用powershell提示無(wú)權(quán)限
powershell輸入
Set-ExecutionPolicy -Scope CurrentUser
然后系統(tǒng)提示輸入
RemoteSigned
一直創(chuàng)建項(xiàng)目失敗
卸載清除緩存重裝
npm uninstall -g vue-cli
npm uninstall -g @vue/cli
npm cache clean --force
npm install -g @vue/cli
創(chuàng)建時(shí)報(bào)錯(cuò)找不到y(tǒng)arn
在你的用戶(hù)名盤(pán)下面C:\Users\Administrator，比如我是lookroot這個(gè)文件夾，里面找到這個(gè) .vuerc 文件
然后修改如下
{
"useTaobaoRegistry": true,
"packageManager": "npm",
"latestVersion": "4.3.1",
"lastChecked": 1587955070777
}
