项目细节容易遇到的坑-less ElementUI icon

本文介绍了在Vue项目中使用ElementUI时遇到的问题,包括使用less加载器时版本过高导致的错误,以及如何通过降低style-loader和less-loader版本来解决。此外,还详细讲解了ElementUI的安装方法,包括全局安装和按需引入,并在main.js中引入样式和组件的步骤。最后,探讨了ElementUI图标引用的方法,强调了正确引用图标所需的CSS配置和格式。
摘要由CSDN通过智能技术生成

1.用lang ='less' 需要执行命令

npm install --save-dev less-loader less

容易版本号过高的坑报错

解决办法

npm install style-loader@5.0.0 --save-dev

npm install less-loader@1.0.0 --save-dev

降低版本号

2.ElementUI 使用

ElementUI 是提前封装好的UI模板

1.1先在Vue 环境中安装

1.2 有2种安装方式(官方文档)

第一种全局引入 npm 安装 npm i element-ui -S(推荐 一次性搞定)

第二种按需引入 <!-- 引入样式 --> <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css"> <!-- 引入组件库 --> <script src="https://unpkg.com/element-ui/lib/index.js"></script>

第一种引入方式下载后,在main.js 中

import ElementUI from 'element-ui';

import 'element-ui/lib/theme-chalk/index.css';

Vue.u

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值