当前位置: 首页 > 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…...

Linux应用开发之网络套接字编程(实例篇)

服务端与客户端单连接 服务端代码 #include <sys/socket.h> #include <sys/types.h> #include <netinet/in.h> #include <stdio.h> #include <stdlib.h> #include <string.h> #include <arpa/inet.h> #include <pthread.h> …...

MFC内存泄露

1、泄露代码示例 void X::SetApplicationBtn() {CMFCRibbonApplicationButton* pBtn GetApplicationButton();// 获取 Ribbon Bar 指针// 创建自定义按钮CCustomRibbonAppButton* pCustomButton new CCustomRibbonAppButton();pCustomButton->SetImage(IDB_BITMAP_Jdp26)…...

学校招生小程序源码介绍

基于ThinkPHPFastAdminUniApp开发的学校招生小程序源码&#xff0c;专为学校招生场景量身打造&#xff0c;功能实用且操作便捷。 从技术架构来看&#xff0c;ThinkPHP提供稳定可靠的后台服务&#xff0c;FastAdmin加速开发流程&#xff0c;UniApp则保障小程序在多端有良好的兼…...

基于当前项目通过npm包形式暴露公共组件

1.package.sjon文件配置 其中xh-flowable就是暴露出去的npm包名 2.创建tpyes文件夹&#xff0c;并新增内容 3.创建package文件夹...

spring:实例工厂方法获取bean

spring处理使用静态工厂方法获取bean实例&#xff0c;也可以通过实例工厂方法获取bean实例。 实例工厂方法步骤如下&#xff1a; 定义实例工厂类&#xff08;Java代码&#xff09;&#xff0c;定义实例工厂&#xff08;xml&#xff09;&#xff0c;定义调用实例工厂&#xff…...

Rust 异步编程

Rust 异步编程 引言 Rust 是一种系统编程语言,以其高性能、安全性以及零成本抽象而著称。在多核处理器成为主流的今天,异步编程成为了一种提高应用性能、优化资源利用的有效手段。本文将深入探讨 Rust 异步编程的核心概念、常用库以及最佳实践。 异步编程基础 什么是异步…...

Caliper 配置文件解析:config.yaml

Caliper 是一个区块链性能基准测试工具,用于评估不同区块链平台的性能。下面我将详细解释你提供的 fisco-bcos.json 文件结构,并说明它与 config.yaml 文件的关系。 fisco-bcos.json 文件解析 这个文件是针对 FISCO-BCOS 区块链网络的 Caliper 配置文件,主要包含以下几个部…...

在WSL2的Ubuntu镜像中安装Docker

Docker官网链接: https://docs.docker.com/engine/install/ubuntu/ 1、运行以下命令卸载所有冲突的软件包&#xff1a; for pkg in docker.io docker-doc docker-compose docker-compose-v2 podman-docker containerd runc; do sudo apt-get remove $pkg; done2、设置Docker…...

动态 Web 开发技术入门篇

一、HTTP 协议核心 1.1 HTTP 基础 协议全称 &#xff1a;HyperText Transfer Protocol&#xff08;超文本传输协议&#xff09; 默认端口 &#xff1a;HTTP 使用 80 端口&#xff0c;HTTPS 使用 443 端口。 请求方法 &#xff1a; GET &#xff1a;用于获取资源&#xff0c;…...

FFmpeg:Windows系统小白安装及其使用

一、安装 1.访问官网 Download FFmpeg 2.点击版本目录 3.选择版本点击安装 注意这里选择的是【release buids】&#xff0c;注意左上角标题 例如我安装在目录 F:\FFmpeg 4.解压 5.添加环境变量 把你解压后的bin目录&#xff08;即exe所在文件夹&#xff09;加入系统变量…...