当前位置: 首页 > news >正文

【已解决】引入 element 组件无法使用编译错误 ERROR Failed to compile with 1 error

如果大家使用这个vue 配合 element 框架不熟练,当你顺利按照文档安装好 vue 和 element 的时候想要使用element 的组件时候确无法展示出来,甚至报错。不妨看看是不是这个问题,

1.首先使用element 的时候,前提是把必须要的 element 组件通过 yarm 或者 npm 安装一下。
2.安装的命令是 npm -i element --save (针对 vue2) | npm -i element-plus --save(vue3).
3.安装的时候会比较漫长,安装好后 会告诉你花费多少秒,安装了多少个包的提示,如图。

在这里插入图片描述
4.安装好后就可以导入这个组建了,在 main.js或者 main.ts里一定要导入

import ElementPlus from 'element-plus' //全局引入
import 'element-plus/dist/index.css' 

这俩,一个是组件,一个是样式缺一不可,在 main 里安装是全局引用,对懒人比较 友好,我比较喜欢,也有按需应用, 自己找找教程吧!!

5.然后在 app.vue或者自己创建一个组件,然后去使用这个官网文档里的组件 直接复制代码即可。
比如代码:

<template><el-button>我是 ElButton</el-button>
</template>
<script>import { ElButton } from 'element-plus'export default {components: { ElButton },}
</script>

在这里插入图片描述
到这就结束了如何使用 element 组件了,一定要按着这个步骤,否则就会有编译错误 ERROR Failed to compile with 1 error 或者是不显示组件样式等等。。

http://www.lryc.cn/news/372784.html

相关文章:

  • Prometheus的四种指标类型
  • FastDFS SpringBoot 客户端 Demo搭建,支持文件上传下载
  • 十大成长型思维:定位思维、商业思维、时间管理思维、学习成长思维、精力管理思维、逻辑表达思维、聚焦思维、金字塔原理、目标思维、反思思维
  • GraphQL(9):Spring Boot集成Graphql简单实例
  • vue3+ Element-Plus 点击勾选框往input中动态添加多个tag
  • 唯美仙侠手游【九幽仙域】win服务端+GM后台+详细教程
  • Qt creator day2练习
  • 哪里有海量的短视频素材,以及短视频制作教程?
  • 文章MSM_metagenomics(三):Alpha多样性分析
  • Web前端与其他前端:深度对比与差异性剖析
  • AI 客服定制:LangChain集成订单能力
  • 【计算机毕业设计】242基于微信小程序的外卖点餐系统
  • java程序监控linux服务器硬件,cpu、mem、disk等
  • 高考报志愿闲谈
  • 面试官考我Object类中的所有方法及场景使用?我...
  • Web前端精通教程:深入探索与实战指南
  • 四轴飞行器、无人机(STM32、NRF24L01)
  • OpenAI Assistants API:如何使用代码或无需代码创建您自己的AI助手
  • CentOS7 配置Nginx域名HTTPS
  • C++入门8 构造函数析构函数顺序|拷贝构造
  • 【git使用四】git分支理解与操作(详解)
  • 【docker】如何解决artalk的跨域访问问题
  • MYSQL 索引下推 45讲
  • CentOS7服务器中安装openCV4.8的教程
  • Java课程设计:基于swing的贪吃蛇小游戏
  • 【HarmonyOS】HUAWEI DevEco Studio 下载地址汇总
  • 华为OD刷题C卷 - 每日刷题30(小明找位置,分隔均衡字符串)
  • SOFTS: 时间序列预测的最新模型以及Python使用示例
  • C++ 取近似值
  • 云原生系列之Docker常用命令