Vue3如何解决Element-plus不生效的问题
更新时间：2024年03月19日 17:28:48 作者：kk爱闹
这篇文章主要介绍了Vue3如何解决Element-plus不生效的问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
vue3中Element-plus不生效问题
只需要在main.js中加上这两句
import ElementPlus from 'element-plus' import 'element-plus/theme-chalk/index.css'
看其他文章说和引入顺序有关，以及不是一个app的相关问题，但我测试下来好像都不是这些问题。
总而言之，我的全局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')
补充：
今天又重新用vue ui建了个项目，按照官网的快速开始指南，并没有什么问题。
一些element-plus组件不能正常使用是啥原因导致的
根据官方文档以及大佬的博客得出以下步骤：
第一步：首先你需要安装unplugin-vue-components和unplugin-auto-import这两款插件
npm install -D unplugin-vue-components unplugin-auto-import
第二步：然后将下列代码插入到你的vite或者webpack的配置文件中，我这边使用的是webpack配置文件。
在添加完以上代码之后，可能会遇到两个问题：
第一个问题：autoimport is not a function
解决办法：
查阅相关资料发现，是版本兼容性的问题，然后我就在package.json文件中查看unplugin-auto-import的版本号，发现是0.17.1好像，反正是17版本，后面降版本，改成0.16.7,然后npm i运行一下，这个问题就不报错了。
第二个问题：Invalid options in vue.config.js: “plugins“ is not allowed
解决办法：
查阅相关资料发现，webpack 相关的配置需要写到 configureWebpack 里，不能直接写在外面。
所以代码如下：
两个问题解决了，就能成功运行了。
总结
以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
打开尤大大的GitHub，发现多了个叫 petite-vue 的东西,Vue3 和 Vite 还没学完呢，又开始整新东西了？本文就来介绍一下2021-07-07
使用ElementUI中el-upload上传文件转base64格式
这篇文章主要介绍了使用ElementUI中el-upload上传文件转base64格式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2024-05-05
做项目时遇到一个需求,后端需要在接口请求时,对用户登陆状态进行判断,需要在请求时携带Cookie,下面这篇文章主要给大家介绍了关于axios+vue请求时携带cookie的相关资料,需要的朋友可以参考下2022-09-09
这篇文章主要介绍了vue实现pdf文件发送到邮箱功能,实现代码包括对邮箱格式内容是否为空的验证方法，代码简单易懂，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下2022-05-05
今天小编就为大家分享一篇vue2过滤器模糊查询方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2018-09-09
这篇文章主要为大家详细介绍了vue封装tabs组件案例，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2022-03-03
在Web开发中,获取DOM元素的宽度、高度以及滚动位移是常见的需求,这篇文章主要给大家介绍了关于vue获取组件中元素宽度常用的方法,需要的朋友可以参考下2024-08-08
这篇文章主要介绍了vue数组对象排序的实现代码，这里整理了详细的代码，非常具有实用价值，需要的朋友可以参考下2018-06-06
本文主要介绍了Vue3怎么使用element-plus，文中通过示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2021-11-11
计算图片的MD5可以将其作为图片的唯一标识,从而优化对图片的存储和检索效率,本文主要介绍了Vue获取图片MD5的常用方法,感兴趣的可以了解下2024-12-12
最新评论