其實(shí)非常簡(jiǎn)單,個(gè)人覺(jué)得比2.x版本簡(jiǎn)潔很多肖油,少了很多配置文件米奸。上手也很快,官網(wǎng)的介紹也挺詳細(xì)的灌旧。
點(diǎn)我進(jìn)入vue-cli官網(wǎng)
第一步:安裝
如果之前已經(jīng)全局安裝了舊版本的 vue-cli (1.x 或 2.x),需要先通過(guò) npm uninstall vue-cli -g 卸載它绰筛。
Vue CLI 需要 Node.js 8.9 或更高版本 (官方推薦 8.11.0+ 我目前是v10.15.3)
以上準(zhǔn)備完后枢泰,命令行安裝:npm install -g @vue/cli
安裝然后 vue --version
確認(rèn)一下版本號(hào)
第二步:創(chuàng)建項(xiàng)目
運(yùn)行以下命令來(lái)創(chuàng)建一個(gè)新項(xiàng)目,項(xiàng)目名稱就叫helloworld
vue create helloworld
會(huì)詢問(wèn)是否使用默認(rèn)項(xiàng)還是手動(dòng)選擇功能铝噩,
我是小白慫慫的默認(rèn)項(xiàng)..
? Please pick a preset:
> default (babel, eslint) //默認(rèn)
> Manually select features //手動(dòng)選擇功能
然后我只安裝了npm衡蚂,所以默認(rèn)npm安裝,還安裝了Yarn的小伙伴應(yīng)該還會(huì)問(wèn)一下安裝方式..
然后就出現(xiàn)了出現(xiàn)了一些可愛(ài)的小表情??和安裝過(guò)程的提示~
Vue CLI v3.0.0-alpha.5
? Creating project in E:\git\note\my-project. // 創(chuàng)建項(xiàng)目
?? Initializing git repository... // 初始化git庫(kù)
?? Installing CLI plugins. This might take a while... // 安裝腳手架插件
最后我們的項(xiàng)目創(chuàng)建完成:
———————— ? 手動(dòng)分割線 ? ————————
然后接下來(lái)是如何引入elementUI呢骏庸?
第一步:進(jìn)入項(xiàng)目目錄并安裝element-ui
cd my-app
npm i element-ui -S
第二步:項(xiàng)目中配置element
vue add element
第三步:接下來(lái)會(huì)出現(xiàn)一些選項(xiàng)需要選擇一下
第一條選項(xiàng)比較重要毛甲,問(wèn)是全部引入還是按需引入~
大家根據(jù)需要選擇即可,我選的默認(rèn)全部具被。
第四步:檢查是否安裝成功
裝完后cmd還會(huì)溫馨提示建議使用git管理~ 我們通過(guò)package.json來(lái)確認(rèn)一下玻募,安裝成功后package.json可以看到相關(guān)依賴。??
第五步:項(xiàng)目中引入
main.js文件中加入代碼一姿,樣式文件得引用進(jìn)來(lái)才可以七咧。
import Element from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
Vue.use(ElementUI)
本篇完跃惫。