芋道前端框架上线之后发现element-ui的icon图标全部乱码

前言

  • 最近发现线上有人反映图标全部是乱码,登录上去看确实乱码,刷新就好
  • 最后一顿搜,发现是sass版本不兼容导致的图标乱码问题

解决办法

1.先把sass升级到1.39.0

2.来到vue.config.js文件配置代码-如果是芋道前端框架不用配置自带

 css: {loaderOptions: {sass: {// 解决 element-ui 图标 icon 偶现乱码问题sassOptions: { outputStyle: 'expanded' }},postcss: {plugins: [postcss]}}},

总结:

经过这一趟流程下来相信你也对 芋道前端框架上线之后发现element-ui的icon图标全部乱码 有了初步的深刻印象,但在实际开发中我 们遇到的情况肯定是不一样的,所以我们要理解它的原理,万变不离其宗。加油,打工人!

有什么不足的地方请大家指出谢谢 -- 風过无痕

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/236800.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

使用Docker部署Nexus Maven私有仓库并结合Cpolar实现远程访问

文章目录 1. Docker安装Nexus2. 本地访问Nexus3. Linux安装Cpolar4. 配置Nexus界面公网地址5. 远程访问 Nexus界面6. 固定Nexus公网地址7. 固定地址访问Nexus Nexus是一个仓库管理工具,用于管理和组织软件构建过程中的依赖项和构件。它与Maven密切相关,可…

Ruckus Wireless Admin 命令执行漏洞复现(CVE-2023-25717)

0x01 产品简介 Ruckus Wireless Admin是ruckuswireless多个路由、硬件设备的后台管理系统。 0x02 漏洞概述 Ruckus Wireless Admin在10.4 及更早版本存在命令执行漏洞。攻击者可通过该漏洞在服务器端任意执行代码,写入后门,获取服务器权限&#xff0c…

Axure之中继器的使用(交互动作reperter属性Item属性)

目录 一.中继器的基本使用 二.中继器的动作(增删改查) 2.1 新增 2.2 删除 2.3 更新行 2.4 效果展示 2.5 模糊查询 三.reperter属性 在Axure中,中继器(Repeater)是一种功能强大的组件,用于创建重复…

Spring Boot学习随笔- 文件上传和下载(在线打开、附件下载、MultipartFile)

学习视频:【编程不良人】2021年SpringBoot最新最全教程 第十二章、文件上传、下载 文件上传 文件上传是指将文件从客户端计算机传输到服务器的过程。 上传思路 前端的上传页面:提交方式必须为post,enctype属性必须为multipart/form-data开发…

html行内元素和块级元素的区别?

HTML中的元素可以分为两种类型:行内元素(inline)和块级元素(block) 文章目录 什么是行内元素什么是块级元素元素转换行内元素转块级元素块级元素转行内元素 区别总结 什么是行内元素 HTML的行内元素(inli…

VTK读写数据

png格式图片转jpg #include <vtkAutoInit.h> VTK_MODULE_INIT(vtkRenderingOpenGL2) VTK_MODULE_INIT(vtkInteractionStyle)#include <vtkSmartPointer.h> #include <vtkPNGReader.h> #include <vtkJPEGWriter.h> #include <vtkImageViewer2.h>…

论文中公式怎么降重 papergpt

大家好&#xff0c;今天来聊聊论文中公式怎么降重&#xff0c;希望能给大家提供一点参考。 以下是针对论文重复率高的情况&#xff0c;提供一些修改建议和技巧&#xff0c;可以借助此类工具&#xff1a; 论文中公式怎么降重 一、引言 在论文撰写过程中&#xff0c;公式是表达学…

php伪协议 [NISACTF 2022]easyssrf

打开题目 我们直接用 file:/// 协议读取看看flag文件 file:///flag 点击curl得到回响 得到提示告诉我们应该看看提示文件 file:///fl4g 跟着去访问了一下 再跟着去访问 从代码中我们可以看出 get传参file&#xff0c;我们用stristr检测file参数里面是否含有file&#xff…

智能优化算法应用:基于堆优化算法3D无线传感器网络(WSN)覆盖优化 - 附代码

智能优化算法应用&#xff1a;基于堆优化算法3D无线传感器网络(WSN)覆盖优化 - 附代码 文章目录 智能优化算法应用&#xff1a;基于堆优化算法3D无线传感器网络(WSN)覆盖优化 - 附代码1.无线传感网络节点模型2.覆盖数学模型及分析3.堆优化算法4.实验参数设定5.算法结果6.参考文…

一篇文章搞定Vue3响应式数据最常用的ref、reactive、computed、watch方法

前言 Vue3 中可以通过响应式 API 来创建响应式对象&#xff0c;相较于 Vue2 中使用 Object.definProperty 来劫持 get 和 set 不同&#xff0c;Vue3 中使用的是 Proxy 来创建响应式对象&#xff0c;使用Proxy有以下几点优势&#xff1a; 1. 对象新增属性不再需要手动 $set 添…

创建型模式 | 原型模式

一、原型模式 1、原理 原型模式&#xff0c;用原型实例指定创建对象的种类&#xff0c;并且通过拷贝这些原型创建新的对象。原型模式其实就是从一个对象再创建另外一个可定制的对象&#xff0c;而且不需要知道任何创建的细节。原型像是一个模板&#xff0c;可以基于它复制好多…

LeetCode Hot100 215.数组中的第k个最大元素

题目&#xff1a; 给定整数数组 nums 和整数 k&#xff0c;请返回数组中第 k 个最大的元素。 请注意&#xff0c;你需要找的是数组排序后的第 k 个最大的元素&#xff0c;而不是第 k 个不同的元素。 你必须设计并实现时间复杂度为 O(n) 的算法解决此问题。 方法一&#xff…

HTML输出特殊字符详细方法

以下是部分特殊字符代码表&#xff0c;它们的完整应用代码格式为&#xff1a;&#;用下面的四位数字替换&#xff0c;将得到对应的符号。&#xff08;注意&#xff1a;应用这些代码&#xff0c;编辑器应该切换到HTML模式&#xff09; ☏260f ☎260e ☺263a ☻263b ☼263c ☽…

Leetcode—73.矩阵置零【中等】

2023每日刷题&#xff08;六十六&#xff09; Leetcode—73.矩阵置零 空间复杂度为O(mn)版实现代码 class Solution { public:void setZeroes(vector<vector<int>>& matrix) {int rowLen matrix.size();int colLen matrix[0].size();vector<int> row…

阿赵UE学习笔记——3、常用界面窗口

阿赵UE学习笔记目录 大家好&#xff0c;我是阿赵。继续学习虚幻引擎&#xff0c;这次介绍的是编辑器的常用界面窗口。 一、视口 这个视口的概念&#xff0c;可以体现出UE对于多屏幕同时显示是多么的友好。我们开发游戏的时候&#xff0c;一般都会同一台电脑用2个或者以上显示器…

Spring Security登录的简单解析

Spring Security登录的简单解析 1.自己写的登录2.进入authenticationManager.authenticate(authenticationToken);3 进入result provider.authenticate(authentication);4 进入 user retrieveUser(username, (UsernamePasswordAuthenticationToken) authentication);5 进入 U…

算法基础之约数之和

约数之和 核心思想&#xff1a; #include<iostream>#include<algorithm>#include<vector>#include<unordered_map>using namespace std;typedef long long LL;const int N 110 , mod 1e97;int main(){int n;cin>>n;unordered_map<int,int&…

需求:通过按钮的点击事件控制另一个输出框/按钮的点击

目录 第一章 接到需求 第二章 了解需求 第三章 解决需求 第四章 优化代码 第五章 解决问题 第一章 接到需求 最近开发的时候遇到这么一个事&#xff0c;技术经理是个全栈&#xff0c;已经把接口生成了&#xff0c;而且前端页面也写好了一个初稿&#xff0c;操作什么的功…

【已解决】taos时序数据库3.0版本,怎么按照时间分组?

taos数据库中按照时间分组&#xff0c;在2.4版本时候可以直接使用INTERVAL(time_unit)来查询。例如 前面可以直接添加_ts的。但是在3.0版本之后&#xff0c;如果直接使用的话&#xff0c;只会返回count&#xff1a; 没有前面的时间。那么在3.0版本时候&#xff0c;怎么修改呢&a…

在mt4上怎么查看CHFJPY品种的合约细则?

在MetaTrader 4 (MT4) 上查看CHFJPY品种的合约细则的方法如下&#xff1a; FXCM福汇官方个人注册登录流程 1.打开MT4软件并登录到您的交易账户。 2.在MT4界面的"市场观察"窗格中&#xff0c;找到并右键单击"CHFJPY"货币对。如果您无法找到"市场观察…