Vue3中正確使用ElementPlus的示例代碼
一、創(chuàng)建Vue3項(xiàng)目
vue create vue_element
選擇自定義項(xiàng)目創(chuàng)建：
選擇這幾項(xiàng)（空格選擇）
后面的幾項(xiàng)全部回車(chē)，這里就不做介紹了，大膽回車(chē)就行，出了事算我的，除非你有特殊需求。（下面是安裝成功后的圖片）
二、進(jìn)入項(xiàng)目，安裝Element-Plus
（1）我這里用的是WebStorm，在命令行中執(zhí)行下面代碼安卓Element-Plus：
npm install element-plus --save
（2） 在main中配置Element-Plus：
import * as ElementPlusIconsVue from '@element-plus/icons-vue'
const app = createApp(App)
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
app.component(key, component)
}
app.use(router).use(ElementPlus).mount('#app')
到這里，Element-Plus里面的控件你都可以使用了。
后面講介紹，如何使用ElementPlus中的Icon控件的配置。
三、配置Icon
（1）在終端執(zhí)行下面代碼進(jìn)行安裝：
npm install @element-plus/icons-vue
（2）在main中進(jìn)行配置
import * as ElementPlusIconsVue from '@element-plus/icons-vue'
const app = createApp(App)
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
app.component(key, component)
}
app.use(router).use(ElementPlus).mount('#app')這樣就可以使用所有ElementPlus配件了
四、測(cè)試運(yùn)行
（1） 配置一個(gè)編譯器
(2) 隨便找一個(gè)ElementPlus用一下子看看。
拿他試一下，直接把代碼復(fù)制到你的Vue就可以。
結(jié)果：
五、Git提交一下
總是報(bào)紅怎么辦？說(shuō)明提示你修改了沒(méi)有提交到git里面。有強(qiáng)迫癥的看一下。
git add . 后再git status看一下子，這樣之后就不報(bào)紅，并提交到git上面了，如果你要pull到github上，這里就不演示了，已經(jīng)有點(diǎn)跑題了。
到此這篇關(guān)于Vue3中正確使用ElementPlus的文章就介紹到這了,更多相關(guān)Vue3使用ElementPlus內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
vue-devtools是一款基于chrome游覽器的插件，用于調(diào)試vue應(yīng)用，這可以極大地提高我們的調(diào)試效率，這篇文章主要介紹了vue devtools的安裝與使用教程,需要的朋友可以參考下2018-08-08
Element-UI日期選擇器(選擇日期范圍)禁用未來(lái)日期實(shí)現(xiàn)代碼
我們?cè)诰W(wǎng)頁(yè)開(kāi)發(fā)時(shí)通常需要用到一些日期組件來(lái)方便用戶選擇時(shí)間,其中element日期組件是一個(gè)非常好用的工具,這篇文章主要給大家介紹了關(guān)于Element-UI日期選擇器(選擇日期范圍)禁用未來(lái)日期的相關(guān)資料,需要的朋友可以參考下2024-02-02
Vue動(dòng)態(tài)組件與異步組件實(shí)例詳解
這篇文章主要介紹了Vue動(dòng)態(tài)組件與異步組件,結(jié)合實(shí)例形式分析了動(dòng)態(tài)組件與異步組件相關(guān)概念、功能及使用技巧,需要的朋友可以參考下2019-02-02
m3u8是一種基于HTTP Live Streaming（HLS）文件視頻格式,它主要是存放整個(gè)視頻的基本信息和分片(Segment)組成,下面這篇文章主要給大家介紹了關(guān)于vue3使用videojs播放m3u8格式視頻的相關(guān)資料,需要的朋友可以參考下2023-06-06
Vue使用vue-cli創(chuàng)建項(xiàng)目
這篇文章主要介紹了Vue使用vue-cli創(chuàng)建項(xiàng)目，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-09-09
淺談Vue static 靜態(tài)資源路徑 和 style問(wèn)題
這篇文章主要介紹了淺談Vue static 靜態(tài)資源路徑 和 style問(wèn)題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2020-11-11
Vue函數(shù)式組件的應(yīng)用實(shí)例詳解
這篇文章主要介紹了Vue函數(shù)式組件的應(yīng)用實(shí)例詳解，本文給大家介紹的非常詳細(xì)，具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2019-08-08
這篇文章主要介紹了vue-cli4.0如何配置CDN加速問(wèn)題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2023-04-04
Vue 用Vant實(shí)現(xiàn)時(shí)間選擇器的示例代碼
這篇文章主要介紹了Vue 用Vant實(shí)現(xiàn)時(shí)間選擇器的示例代碼，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2019-10-10
vue項(xiàng)目如何通過(guò)url鏈接引入其他系統(tǒng)頁(yè)面
這篇文章主要介紹了vue項(xiàng)目如何通過(guò)url鏈接引入其他系統(tǒng)頁(yè)面問(wèn)題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2023-03-03