Vue3！ElementPlus是如何像ElementUI一样使用Icon的？

鍓嶈█Vue3宸茬粡鍒囨崲鍒伴粯璁ょ増鏈簡锛岀幇鍦ㄦ柊寤虹殑椤圭洰澶у鐩存帴浣跨敤Vue3锛屼絾鏄崌绾у埌ElementPlus涔嬪悗锛屽緢澶氫汉瑙夊緱鍥炬爣鐨勪娇鐢ㄦ柟寮忔病鏈夌敤锛屼笉濂界敤锛屾墍浠ヤ粖澶╂垜灏嗕笌澶у鍒嗕韩涓€涓畝鍗曟柟渚跨殑鏂规硶锛岀敤鐔熸倝鐨勬柟寮忎娇鐢ㄥ浘鏍囥€備綘鍙渶瑕佷娇鐢║noCSSUnoCSS鏄痑ntfu寮€鍙戠殑鍘熷瓙CSS寮曟搸銆傛垜涓嶄細鍦ㄨ繖閲岃缁嗕粙缁嶃€傚鏋滀綘鏈夊叴瓒ｏ紝鍙互闃呰浠栫殑鏂囩珷[ReimaginingAtomicCSS]銆俛ntfu涓篤ue3鐢熸€佺紪鍐欎簡寰堝浼樼鐨勫伐鍏凤紝NiubiPlus銆傛枃寮€澶翠互涓嬫暀绋嬩粎閽堝Vite锛孷ueCli璇疯嚜琛屽涔犮€傚畨瑁呬緷璧?@iconify-json/ep鏄疎lementPlus鐨勫浘鏍囧簱npmi-Dunocss@iconify-json/ep淇敼vite.config.ts閰嶇疆//vite.config.tsimport{defineConfig}from'vite'importvuefrom'@vitejs/plugin-vue'importUnocssfrom'unocss/vite'import{presetIcons}from'unocss'exportdefaultdefineConfig({plugins:[vue(),//娣诲姞濡備笅閰嶇疆Unocss({presets:[presetIcons({scale:1.2,warn:true}),],//涓嬮潰鐨勯厤缃槸鐩存帴浣跨敤鏍囩variants:[{match:(s)=>{if(s.startsWith('i-')){return{matcher:s,selector:(s)=>{returns.startsWith('.')?`${s.slice(1)},${s}`:s},}}},},],})]})淇敼main.ts//鍦╩ain.ts涓坊鍔犲涓嬩唬鐮乮mport'uno.css'寮€濮嬪啓浠ｇ爜浣跨敤鏂规硶锛歱refixi-ep-+鍥炬爣鍚嶇О锛宨-ep-lock娉ㄦ剰UnoCSS鏄€氳繃鍏抽敭瀛楀尮閰嶆寜闇€鐢熸垚鐨勶紝鎵€浠ユ敞鎰忎笅闈㈢殑鐢ㄦ硶