【新手向】vue出现空白页情况之一

本文介绍了在Vue3项目中遇到Element插件导致页面空白的解决办法,通过替换为Element Plus插件并进行相关配置。在main.js中引入Element Plus并设置,解决了图标显示但内容缺失的问题。对于新手,提示了代码修改的注意点和报错原因。
摘要由CSDN通过智能技术生成

在b站学习vue前端项目,跟着项目走,老师能跑成功,我确是空白页,发现是插件的问题(我用的是vue3)

解决方法:新建一个项目

1.把element插件替换为plus版

教程中用的插件:vue-cli-plugin-element
替换成这个插件:vue-cli-plugin-element-plus
在这里插入图片描述
此时发现vue的图标出现了,但没有内容

2.main.js设置

打开 cmd 运行 npm install element-plus --save
在main.js中加入这些

import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'


app.use(ElementPlus)

要注意格式问题!!!
在这里插入图片描述

新手小tips:
1.红色小箭头表示此处相比源文件有修改
在这里插入图片描述
2.蓝色部分表示要删掉换行符,不然会报错
在这里插入图片描述

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值