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

Vite + Electron 时，Electron 渲染空白，静态资源加载错误等问题解决

news 2025/9/16 7:30:52

问题

如果在 electron 里直接引入 vite 打包后的东西，那么有些资源是请求不到的

在这里插入图片描述

这是我的引入方式
在这里插入图片描述

根据报错，我们来到 vite 打包后的路径看一看 ，修改一下 dist 里的文件路径试了一试

在这里插入图片描述
修改后的样子，发现是可以的了
在这里插入图片描述

原因分析

vite 打包后的资源都是以 / 开头的，前导斜杠表示您要从根目录链接文件， 具体可以看这里

在这里插入图片描述

解决办法

知道问题所在，那么就有两个方向了，要么配置 vite，要么配置 electron

这里觉得配置vite 是最方便的，查到了 vite 如何配置，在 vite.config.ts 中指定 base

在这里插入图片描述
之后在打包，在 electron 里试试，嗯正常了~

在这里插入图片描述
因为打包后的文件都不是以/开头的了

在这里插入图片描述

参考文章

1. vue3+vite的项目如何将打包后的绝对路径改为相对路径

相关文章：

Vite + Electron 时，Electron 渲染空白，静态资源加载错误等问题解决

问题 如果在 electron 里直接引入 vite 打包后的东西，那么有些资源是请求不到的 这是我的引入方式 根据报错，我们来到 vite 打包后的路径看一看 ，修改一下 dist 里的文件路径试了一试 修改后的样子，发现是可以的了 原因分析 …...

编程日记 2024/9/15 22:40:47

ZAB协议（算法）

一、ZAB（ZooKeeper Atomic Broadcast）介绍 ZAB 即 ZooKeeper Atomic Broadcast，是 ZooKeeper 实现分布式数据一致性的核心算法。它是一种原子广播协议，用于确保在分布式环境中，多个 ZooKeeper 服务器之间的数据一致性。…...

编程日记 2024/9/15 22:38:44

多个音频怎么合并？把多个音频合并在一起的方法推荐

多个音频怎么合并？无论是制作连贯的播客节目还是将音乐片段整合成专辑，音频合并已成为许多创作者的常见需求。通过有效合并音频，可以显著提升项目的整体质量，确保内容的连续性和一致性。然而，合并后的文件通常比原始单…...

编程日记 2024/9/15 22:37:43

【Django】Django Class-Based Views (CBV) 与 DRF APIView 的区别解析

Django Class-Based Views (CBV) 与 DRF APIView 的区别解析 在 Django 开发中，基于类的视图（Class-Based Views, CBV）是实现可重用性和代码结构化的利器。而 Django REST Framework (DRF) 提供的 APIView 是针对 API 开发的扩展。 一、CBV …...

编程日记 2024/9/15 22:36:42

如何增加Google收录量？

想增加Google收录量，首先自然是你的页面数量就要多，但这些页面的内容也绝对不能敷衍，你的网站都没多少页面，谷歌哪怕想收录都没办法，当然，这是一个过程，持续缓慢的增加页面，增加网站…...

编程日记 2024/9/15 22:35:40

leetcode练习 格雷编码

n 位格雷码序列 是一个由 2n 个整数组成的序列，其中： 每个整数都在范围 [0, 2n - 1] 内（含 0 和 2n - 1）第一个整数是 0一个整数在序列中出现 不超过一次每对 相邻 整数的二进制表示 恰好一位不同 ，且第一个 和 最后一…...

编程日记 2024/9/15 22:33:37

【LLM：Gemini】文本摘要、信息提取、验证和纠错、重新排列图表、视频理解、图像理解、模态组合

开始使用Gemini 目录 开始使用Gemini Gemini简介 Gemini实验结果 Gemini的多模态推理能力 文本摘要 信息提取 验证和纠错 重新排列图表 视频理解 图像理解 模态组合 Gemini多面手编程助理 库的使用 引用 本文概述了Gemini模型和如何有效地提示和使用这些模型。本…...

编程日记 2024/9/15 22:32:36

CMS之Wordpress建设

下载 https://cn.wordpress.org/ 宝塔安装Wordpress 创建网站 上传文件、并解压、剪切文件到项目根目录 安装 -> 数据库信息 -> 标题信息 http://wordpress.xxxxx.com 登录 http://wordpress.xxxxxxxxx.com/wp-admin/ 1. 主题（模板） wordpress-基本使用-02-在主题…...

编程日记 2024/9/15 22:30:35

使用Neo4j存储聊天记录的简单教程

引言 在当今的数据驱动世界中，关系型数据库有时难以处理复杂的、相互关联的数据集。Neo4j作为一款开源图数据库，以其高效管理高连接数据的能力而广受欢迎。本篇文章将详细介绍如何使用Neo4j来存储聊天信息历史，引导您在实际项目中利用其强大…...

编程日记 2024/9/15 22:29:34

前端面试常考算法

快速排序 #include<iostream> #include<cstdio> using namespace std; const int N 100005; int a[N];void quick_sort(int a[], int l, int r) {if (l > r) return;int x a[l r >> 1];int i l - 1, j r 1;while (i < j) {while (a[i] < x);…...

编程日记 2024/9/15 22:28:33

【机试准备】常用容器与函数

Vector详解 原文链接&#xff1a;【超详细】C vector 详解 例题&#xff0c;这一篇就够了-CSDN博客 向量&#xff08;Vector&#xff09;是一个封装了动态大小数组的顺序容器&#xff08;Sequence Container&#xff09;。跟任意其它类型容器一样&#xff0c;它能够存放各种…...

编程日记 2024/9/15 22:25:30

Base 社区见面会 | 新加坡站

活动信息 备受期待的 Base 社区见面会将于 Token2049 期间在新加坡举行&#xff0c;为 Base 爱好者和生态系统建设者提供一个独特的交流机会。本次活动由 DAOBase 组织&#xff0c;Base 和 Coinbase 提供支持&#xff0c;并得到了以下合作伙伴的大力支持&#xff1a; The Sand…...

编程日记 2024/9/15 22:24:28

麒麟操作系统搭建Nacos集群

Nacos 集群搭建 2.4.2 环境介绍 操作系统Kylin Linux Advanced Server V10 (Lance)Kylin Linux Advanced Server V10 (Lance)Kylin Linux Advanced Server V10 (Lance)内核版本Linux 4.19.90-52.22.v2207.ky10.aarch64Linux 4.19.90-52.22.v2207.ky10.aarch64Linux 4.19.90-52…...

编程日记 2024/9/15 22:23:27

Imagination推出性能最高且具有高等级功能安全性的汽车GPU IP

Imagination DXS GPU 进一步扩大其在汽车领域的领先地位 产品亮点 &#xff1a; 峰值性能比 Imagination 上一代汽车 GPU 提高了 50%&#xff0c;可扩展至 192GPixel/s、6 TFLOPS 和 24TOPS计算工作负载的性能提升多达十倍引入创新的分布式功能安全机制&#xff0c;以最小的…...

编程日记 2024/9/15 22:22:26

端口大全说明,HTTP,TCP,UDP常见端口对照表

HTTP,TCP,UDP常见端口对照表,下面罗列了包括在Linux 中的服务、守护进程、和程序所使用的最常见的通信端口小贴士&#xff1a;CtrlF 快速查找 Http端口号&#xff08;点标题可收缩或展开&#xff09; No1.最常用端口 端口号码/层名称注释1tcpmuxTCP端口服务多路复用5rje远程作…...

编程日记 2024/9/15 22:18:22

dplyr、tidyverse和ggplot2初探

dplyr、tidyverse 和 ggplot2 之间有紧密的联系&#xff0c;它们都是 R 语言中用于数据处理和可视化的工具&#xff0c;且都源于 Hadley Wickham 的工作。它们各自有不同的功能&#xff0c;但可以无缝协作&#xff0c;帮助用户完成从数据处理到数据可视化的工作流。以下是它们之…...

编程日记 2024/9/15 22:14:19

pandas:读取各类文件方法以及爬虫时json数据保存

文件的读取与写入 | 常用读文件方法 | 说明 | | -------------- | ---------------- | | read_csv | 读取CSV文件 | | read_excel | 读取Excel文件 | | read_html | 读取网页HTML文件 | | read_table | 通用读取方法 | | 常用写文…...

编程日记 2024/9/15 22:13:18

二、（JS）JS中常见的键盘事件

一、常见的键盘事件 onkeydown 某个键盘按键被按下onkeypress 某个键盘按键被按下onkeyup 某个键盘按键被松开 二、事件的执行顺序 onkeydown、onkeypress、onkeyup down 事件先发生&#xff1b;press 发生在文本被输入&#xff1b;up …...

编程日记 2024/9/15 22:10:15

【CSS】样式水平垂直居中

行内元素&#xff1a; 如果被设置元素为文本、图片等行内元素时&#xff0c;水平居中是通过给父元素设置 text-align:center <body> <div class"txtCenter">我想要在父容器中水平居中显示。</div> </body>div是文本元素的父元素 因此我们对…...

编程日记 2024/9/15 22:07:12

深入理解数据分析的使用流程：从数据准备到洞察挖掘

数据分析是企业和技术团队实现价值的核心。 5 秒内你能否让数据帮你做出决策&#xff1f; 通过本文&#xff0c;我们将深入探讨如何将原始数据转化为有意义的洞察&#xff0c;帮助你快速掌握数据分析的关键流程。 目录 数据分析的五个核心步骤1. 数据获取常用数据获取方式 2. 数…...

编程日记 2024/9/15 22:06:11

装饰模式（Decorator Pattern）重构java邮件发奖系统实战

前言 现在我们有个如下的需求&#xff0c;设计一个邮件发奖的小系统&#xff0c; 需求 1.数据验证 → 2. 敏感信息加密 → 3. 日志记录 → 4. 实际发送邮件 装饰器模式&#xff08;Decorator Pattern&#xff09;允许向一个现有的对象添加新的功能&#xff0c;同时又不改变其…...

编程新知 2025/9/14 11:23:04

基于ASP.NET+ SQL Server实现（Web）医院信息管理系统

医院信息管理系统 1. 课程设计内容 在 visual studio 2017 平台上&#xff0c;开发一个“医院信息管理系统”Web 程序。 2. 课程设计目的 综合运用 c#.net 知识&#xff0c;在 vs 2017 平台上&#xff0c;进行 ASP.NET 应用程序和简易网站的开发&#xff1b;初步熟悉开发一…...

编程新知 2025/9/14 23:43:40

通过Wrangler CLI在worker中创建数据库和表

官方使用文档&#xff1a;Getting started Cloudflare D1 docs 创建数据库 在命令行中执行完成之后&#xff0c;会在本地和远程创建数据库&#xff1a; npx wranglerlatest d1 create prod-d1-tutorial 在cf中就可以看到数据库&#xff1a; 现在&#xff0c;您的Cloudfla…...

编程新知 2025/9/13 17:44:12

循环冗余码校验CRC码 算法步骤+详细实例计算

通信过程&#xff1a;&#xff08;白话解释&#xff09; 我们将原始待发送的消息称为 M M M&#xff0c;依据发送接收消息双方约定的生成多项式 G ( x ) G(x) G(x)&#xff08;意思就是 G &#xff08; x ) G&#xff08;x) G&#xff08;x) 是已知的&#xff09;&#xff0…...

编程新知 2025/9/6 15:42:34

《从零掌握MIPI CSI-2: 协议精解与FPGA摄像头开发实战》-- CSI-2 协议详细解析 (一）

CSI-2 协议详细解析 (一&#xff09; 1. CSI-2层定义&#xff08;CSI-2 Layer Definitions&#xff09; 分层结构 &#xff1a;CSI-2协议分为6层&#xff1a; 物理层&#xff08;PHY Layer&#xff09; &#xff1a; 定义电气特性、时钟机制和传输介质&#xff08;导线&#…...

编程新知 2025/9/10 1:16:45

学校招生小程序源码介绍

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

编程新知 2025/9/14 12:35:09

实现弹窗随键盘上移居中

实现弹窗随键盘上移的核心思路 在Android中&#xff0c;可以通过监听键盘的显示和隐藏事件&#xff0c;动态调整弹窗的位置。关键点在于获取键盘高度&#xff0c;并计算剩余屏幕空间以重新定位弹窗。 // 在Activity或Fragment中设置键盘监听 val rootView findViewById<V…...

编程新知 2025/7/9 1:12:03

Android 之 kotlin 语言学习笔记三（Kotlin-Java 互操作）

参考官方文档&#xff1a;https://developer.android.google.cn/kotlin/interop?hlzh-cn 一、Java&#xff08;供 Kotlin 使用&#xff09; 1、不得使用硬关键字 不要使用 Kotlin 的任何硬关键字作为方法的名称 或字段。允许使用 Kotlin 的软关键字、修饰符关键字和特殊标识…...

编程新知 2025/9/14 22:18:38

优选算法第十二讲：队列 + 宽搜 优先级队列

优选算法第十二讲&#xff1a;队列 宽搜 && 优先级队列 1.N叉树的层序遍历2.二叉树的锯齿型层序遍历3.二叉树最大宽度4.在每个树行中找最大值5.优先级队列 -- 最后一块石头的重量6.数据流中的第K大元素7.前K个高频单词8.数据流的中位数 1.N叉树的层序遍历 2.二叉树的锯…...

编程新知 2025/9/7 8:51:06

Yolov8 目标检测蒸馏学习记录

yolov8系列模型蒸馏基本流程&#xff0c;代码下载&#xff1a;这里本人提交了一个demo:djdll/Yolov8_Distillation: Yolov8轻量化_蒸馏代码实现 在轻量化模型设计中&#xff0c;**知识蒸馏&#xff08;Knowledge Distillation&#xff09;**被广泛应用&#xff0c;作为提升模型…...

编程新知 2025/9/10 18:41:52