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

vue2.0+elementui集成file-loader之后图标失效问题

背景

跑vue2+elementUI项目时,由于前端这边需要在本地存放xlsx模板文件,供用户下载模板文件,所以需要在webpack构建的时候增加file-loader进行解析xlsx文件打包。

vue版本2.x
element-ui 版本 2.13.x

注意

npm i -D file-loader@版本号

给vue项目安装file-loader的时候,需要尽量保证这个的版本同node_modules中element-ui中的file-loader版本相同,(避免不必要的问题)
在这里插入图片描述

vue.config.js(链式webpack)

module.exports = {....// 添加对 .xlsx 文件的处理规则config.module.rule("xlsx").test(/\.xlsx$/).use("file-loader").loader("file-loader").options({name: "[name].[hash:8].[ext]"}).end();...},
};

重新启动vue项目,可以看到图标已经出来了!!!
如果有什么新问题,欢迎留言评论!!

相关文章:

vue2.0+elementui集成file-loader之后图标失效问题

背景 跑vue2elementUI项目时,由于前端这边需要在本地存放xlsx模板文件,供用户下载模板文件,所以需要在webpack构建的时候增加file-loader进行解析xlsx文件打包。 vue版本2.x element-ui 版本 2.13.x 注意 npm i -D file-loader版本号给vue项…...

C# 文件帮助类(FileHelper)

引言 在研究程序反射的时候我们往往需要获取当前运行程序所引用的dll文件,按照传统的方式我们可以维护一个这样的列表,但是这样维护成本实在是太高,而且不利于团队合作开发,在高版本的.net 4.6.2之后官方出了专门的dll帮我们做这个事情Microsoft.Extensions.DependencyMod…...

WordPress 外链跳转插件

WordPress 外链跳转插件是本站开发的一款WordPress插件,能对文中外链添加一层过滤,有效防止追踪,以及提醒用户。 类似于知乎、CSDN打开其他链接的提示。 后台可以设置白名单 学习资料源代码:百度网盘 密码:123...

算法的10大排序

10大排序算法--python 一颗星--选择排序一颗星--冒泡排序一颗星--插入排序两颗星--归并排序(递归-难)三颗星--桶排序三颗星--计数排序四颗星--基数排序四颗星--快速排序,寻找标志位(递归-难)四颗星--又是比较难的希尔排…...

“十道机器学习问题,帮助你了解基础知识和常见算法“

目录 简介: 1. 什么是机器学习?它与传统编程有什么不同之处?2. 请解释监督学习和无监督学习的区别。3. 什么是过拟合和欠拟合?如何解决这些问题?4. 请解释交叉验证在机器学习中的作用。5. 什么是特征选择?为…...

部署WAF安全应用防火墙(openresty部署)

使用NGINX+Openresty实现WAF功能 一、了解WAF 1.1 什么是WAF Web应用防护系统(也称:网站应用级入侵防御系统 。英文:Web Application Firewall,简称: WAF)。利用国际上公认的一种说法:Web应用 防火墙 是通过执行一系列针对HTTP/HTTPS的 安全策略 来专门为Web应用提供保…...

yml转properties工具

目前搜索到的大部分代码都存在以下问题: 复杂结构解析丢失解析后顺序错乱 所以自己写了一个,经过不充分测试,基本满足使用。可以直接在线使用 在线地址 除了yml和properties互转之外,还可以生成代码、sql转json等,可…...

zerotier 搭建 moon中转服务器 及 自建planet

搭建moon 服务器 环境准备 # 安装依赖 yum install wget gcc gcc-c git -y yum install json-devel -y# 下载及安装 curl -s https://install.zerotier.com/ | sudo bash节点ID 配置 配置moon.json文件 cd /var/lib/zerotier-one/# 导出依赖 zerotier-idtool initmoon ide…...

深入了解Rabbit加密技术:原理、实现与应用

一、引言 在信息时代,数据安全愈发受到重视,加密技术作为保障信息安全的核心手段,得到了广泛的研究与应用。Rabbit加密技术作为一种新型加密方法,具有较高的安全性和便捷性。本文将对Rabbit加密技术进行深入探讨,分析…...

Linux常用命令——mv命令

文章目录 1. 简介2. 命令格式3. 主要参数4. 常见用法及示例4.1 移动文件4.2 重命名文件4.3 交互式移动文件4.4 强制移动文件4.5 移动多个文件4.6 使用通配符移动文件 5. 注意事项6. 结论 1. 简介 mv 命令在Linux系统中用于移动文件或目录,同时也可以用于重命名文件…...

Panalog 日志审计系统 前台RCE漏洞复现

0x01 产品简介 Panalog是一款日志审计系统,方便用户统一集中监控、管理在网的海量设备。 0x02 漏洞概述 Panalog日志审计系统 sy_query.php接口处存在远程命令执行漏洞,攻击者可执行任意命令,接管服务器权限。 0x03 复现环境 FOFA&#xf…...

Android设置文字颜色渐变

项目中用到了很多文字颜色渐变的设计,因此做一下记录。 核心代码如下: /*** 统一文字渐变色设置* param colors 渐变色字符串数组* param positions 渐变色位置数组,可为空* param start 渐变起始点,可为空* param end 渐变结束…...

java基础面试题(二)

java后端面试题大全 3.JVM3.1 对象实例、类信息、常量、静态变量分别在运行时数据区的哪个位置?3.2 java类的加载流程3.3 java内存溢出什么时候会发生以及解决方法 3.JVM 3.1 对象实例、类信息、常量、静态变量分别在运行时数据区的哪个位置? 堆 对象实例、String常量池、基…...

php爬虫实现把目标页面变成自己的网站页面

最近又被烦的不行,琐事不断,要是比起懒来一个人比一个人懒,但是懒要转换成动力啊,能让自己真正的偷懒,而不是浪费时间。每天还是需要不断的学习的,才能更好的提高效率,把之前做的简单小功能爬虫…...

[c语言c++]手写你自己的swap交换函数

函数传参有按值传递,指针传递,引用传递,分别看一下三种情况下的交换函数如何书写,应该使用哪种最方便。 当书写一个交换两个值的 swap 函数时,我们可以分别使用按值传参、指针传参和引用传参的方式来实现。下面是示例和…...

技术类知识汇总(二)

在自己日常学习javaweb的过程中,做的一些笔记和总结,汇总如下: Springboot项目的静态资源(html,css,js等前端资源)默认存放目录为:classpath:/static classpath:/public classpath:/resources"三层架…...

简单好用!日常写给 ChatGPT 的几个提示词技巧

ChatGPT 很强,但是有时候又显得很蠢,下面是使用 GPT4 的一个实例: 技巧一:三重冒号 """ 引用内容使用三重冒号 """,让 ChatGPT 清晰引用的内容: 技巧二:角色设定…...

pytorch分布式训练

1 基本概念 rank:进程号,在多进程上下文中,我们通常假定rank 0是第一个进程或者主进程,其它进程分别具有1,2,3不同rank号,这样总共具有4个进程 node:物理节点,可以是一个…...

【PyTorch】(三)模型的创建、参数初始化、保存和加载

文章目录 1. 模型的创建1.1. 创建方法1.1.1. 通过使用模型组件1.1.2. 通过继承nn.Module类 1.2. 模型组件1.2.1. 网络层1.2.2. 函数包1.2.3. 容器 1.3. 将模型转移到GPU 2. 模型参数初始化3. 模型的保存与加载3.1. 只保存参数3.2. 保存模型和参数 1. 模型的创建 1.1. 创建方法…...

高效开发之:判断复杂list中的对象属性是否包含某个值

技术使用&#xff1a;使用了Java 8引入的Stream API以及Optional类。这些特性用于简化集合的处理和减少空指针异常。 List<ResourceInfoDto> authData chatBase.getData();String baseName dto.getBaseName();Optional<ResourceInfoDto> authWithResourceCode a…...

css实现圆环展示百分比,根据值动态展示所占比例

代码如下 <view class""><view class"circle-chart"><view v-if"!!num" class"pie-item" :style"{background: conic-gradient(var(--one-color) 0%,#E9E6F1 ${num}%),}"></view><view v-else …...

基于服务器使用 apt 安装、配置 Nginx

&#x1f9fe; 一、查看可安装的 Nginx 版本 首先&#xff0c;你可以运行以下命令查看可用版本&#xff1a; apt-cache madison nginx-core输出示例&#xff1a; nginx-core | 1.18.0-6ubuntu14.6 | http://archive.ubuntu.com/ubuntu focal-updates/main amd64 Packages ng…...

【算法训练营Day07】字符串part1

文章目录 反转字符串反转字符串II替换数字 反转字符串 题目链接&#xff1a;344. 反转字符串 双指针法&#xff0c;两个指针的元素直接调转即可 class Solution {public void reverseString(char[] s) {int head 0;int end s.length - 1;while(head < end) {char temp …...

在Ubuntu24上采用Wine打开SourceInsight

1. 安装wine sudo apt install wine 2. 安装32位库支持,SourceInsight是32位程序 sudo dpkg --add-architecture i386 sudo apt update sudo apt install wine32:i386 3. 验证安装 wine --version 4. 安装必要的字体和库(解决显示问题) sudo apt install fonts-wqy…...

Selenium常用函数介绍

目录 一&#xff0c;元素定位 1.1 cssSeector 1.2 xpath 二&#xff0c;操作测试对象 三&#xff0c;窗口 3.1 案例 3.2 窗口切换 3.3 窗口大小 3.4 屏幕截图 3.5 关闭窗口 四&#xff0c;弹窗 五&#xff0c;等待 六&#xff0c;导航 七&#xff0c;文件上传 …...

Spring AI Chat Memory 实战指南:Local 与 JDBC 存储集成

一个面向 Java 开发者的 Sring-Ai 示例工程项目&#xff0c;该项目是一个 Spring AI 快速入门的样例工程项目&#xff0c;旨在通过一些小的案例展示 Spring AI 框架的核心功能和使用方法。 项目采用模块化设计&#xff0c;每个模块都专注于特定的功能领域&#xff0c;便于学习和…...

云原生周刊:k0s 成为 CNCF 沙箱项目

开源项目推荐 HAMi HAMi&#xff08;原名 k8s‑vGPU‑scheduler&#xff09;是一款 CNCF Sandbox 级别的开源 K8s 中间件&#xff0c;通过虚拟化 GPU/NPU 等异构设备并支持内存、计算核心时间片隔离及共享调度&#xff0c;为容器提供统一接口&#xff0c;实现细粒度资源配额…...

用神经网络读懂你的“心情”:揭秘情绪识别系统背后的AI魔法

用神经网络读懂你的“心情”:揭秘情绪识别系统背后的AI魔法 大家好,我是Echo_Wish。最近刷短视频、看直播,有没有发现,越来越多的应用都开始“懂你”了——它们能感知你的情绪,推荐更合适的内容,甚至帮客服识别用户情绪,提升服务体验。这背后,神经网络在悄悄发力,撑起…...

DeepSeek越强,Kimi越慌?

被DeepSeek吊打的Kimi&#xff0c;还有多少人在用&#xff1f; 去年&#xff0c;月之暗面创始人杨植麟别提有多风光了。90后清华学霸&#xff0c;国产大模型六小虎之一&#xff0c;手握十几亿美金的融资。旗下的AI助手Kimi烧钱如流水&#xff0c;单月光是投流就花费2个亿。 疯…...

Python的__call__ 方法

在 Python 中&#xff0c;__call__ 是一个特殊的魔术方法&#xff08;magic method&#xff09;&#xff0c;它允许一个类的实例像函数一样被调用。当你在一个对象后面加上 () 并执行时&#xff08;例如 obj()&#xff09;&#xff0c;Python 会自动调用该对象的 __call__ 方法…...