Vue3如何解決Element-plus不生效的問題
vue3中Element-plus不生效問題
只需要在main.js中加上這兩句
import ElementPlus from 'element-plus' import 'element-plus/theme-chalk/index.css'
看其他文章說和引入順序有關(guān)，以及不是一個(gè)app的相關(guān)問題，但我測試下來好像都不是這些問題。
總而言之，我的全局main.js配置是這樣：
import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
import ElementPlus from 'element-plus'
import 'element-plus/theme-chalk/index.css'
createApp(App).use(store).use(router).use(ElementPlus).mount('#app')
補(bǔ)充：
今天又重新用vue ui建了個(gè)項(xiàng)目，按照官網(wǎng)的快速開始指南，并沒有什么問題。
一些element-plus組件不能正常使用是啥原因?qū)е碌?/h2>
根據(jù)官方文檔以及大佬的博客得出以下步驟：
第一步：首先你需要安裝unplugin-vue-components和unplugin-auto-import這兩款插件
npm install -D unplugin-vue-components unplugin-auto-import
第二步：然后將下列代碼插入到你的vite或者webpack的配置文件中，我這邊使用的是webpack配置文件。
在添加完以上代碼之后，可能會(huì)遇到兩個(gè)問題：
第一個(gè)問題：autoimport is not a function
解決辦法：
查閱相關(guān)資料發(fā)現(xiàn)，是版本兼容性的問題，然后我就在package.json文件中查看unplugin-auto-import的版本號，發(fā)現(xiàn)是0.17.1好像，反正是17版本，后面降版本，改成0.16.7,然后npm i運(yùn)行一下，這個(gè)問題就不報(bào)錯(cuò)了。
第二個(gè)問題：Invalid options in vue.config.js: “plugins“ is not allowed
解決辦法：
查閱相關(guān)資料發(fā)現(xiàn)，webpack 相關(guān)的配置需要寫到 configureWebpack 里，不能直接寫在外面。
所以代碼如下：
兩個(gè)問題解決了，就能成功運(yùn)行了。
總結(jié)
以上為個(gè)人經(jīng)驗(yàn)，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
vue中Form 表單的 resetFields() 失效原因及問題解決
在Vue項(xiàng)目中,使用formRef.value.resetFields()方法重置表單時(shí)可能遇到不起作用的問題,下面就來介紹一下如何解決,感興趣的可以了解一下2024-09-09
使用vue-router跳轉(zhuǎn)新頁面時(shí)通過新窗口打開方式
文章提到查看vue-router4文檔,可能是指引讀者了解或?qū)W習(xí)vue-router4的新特性、安裝方法、API或使用案例等相關(guān)信息,vue-router4是Vue.js框架的路由管理器,用于構(gòu)建單頁面應(yīng)用2025-10-10
vue3如何將html元素變成canvas(海報(bào)生成),進(jìn)行圖片保存/截圖
這篇文章主要介紹了vue3實(shí)現(xiàn)將html元素變成canvas(海報(bào)生成),進(jìn)行圖片保存/截圖，具有很好的參考價(jià)值，希望對大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-05-05
Vant中List組件immediate-check=false無效的解決
這篇文章主要介紹了Vant中List組件immediate-check=false無效的解決，具有很好的參考價(jià)值，希望對大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2023-01-01
vue實(shí)現(xiàn)裁切圖片同時(shí)實(shí)現(xiàn)放大、縮小、旋轉(zhuǎn)功能
這篇文章主要介紹了vue實(shí)現(xiàn)裁切圖片同時(shí)實(shí)現(xiàn)放大、縮小、旋轉(zhuǎn)功能，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2018-03-03
vue使用axios導(dǎo)出后臺(tái)返回的文件流為excel表格詳解
這篇文章主要介紹了vue使用axios導(dǎo)出后臺(tái)返回的文件流為excel表格方式，具有很好的參考價(jià)值，希望對大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-08-08
vue項(xiàng)目啟動(dòng)如何設(shè)置默認(rèn)啟動(dòng)頁
這篇文章主要介紹了vue項(xiàng)目啟動(dòng)如何設(shè)置默認(rèn)啟動(dòng)頁問題，具有很好的參考價(jià)值，希望對大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2023-06-06
Vue3前置必備JavaScript知識之從基礎(chǔ)到實(shí)戰(zhàn)進(jìn)階
這篇文章主要介紹了Vue3前置必備JavaScript知識之從基礎(chǔ)到實(shí)戰(zhàn)進(jìn)階的相關(guān)資料,從變量與常量、模版字符串、對象操作、解構(gòu)賦值、箭頭函數(shù)、數(shù)組高頻方法、Promise+Async/Await到模塊化,全面夯實(shí)了開發(fā)者的基礎(chǔ),需要的朋友可以參考下2026-03-03
vue項(xiàng)目打包之后接口出現(xiàn)錯(cuò)誤的問題及解決
這篇文章主要介紹了vue項(xiàng)目打包之后接口出現(xiàn)錯(cuò)誤的問題及解決方案，具有很好的參考價(jià)值，希望對大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-04-04
vue?router進(jìn)行路由跳轉(zhuǎn)并攜帶參數(shù)的實(shí)例詳解(params/query)
在使用`router.push`進(jìn)行路由跳轉(zhuǎn)到另一個(gè)組件時(shí)，可以通過`params`或`query`來傳遞參數(shù)，這篇文章主要介紹了vue?router進(jìn)行路由跳轉(zhuǎn)并攜帶參數(shù)（params/query）,需要的朋友可以參考下2023-09-09