electron打包桌面版.exe之vue项目踩坑(vue3+electron 解决打包后首页打开空白,打包后路由不跳转及请求不到后端数据等问题)

vue项目https://www.qingplus.cn/components-web/index打包桌面版问题集合

一、静态资源加载问题
npm run electron_dev

在这里插入图片描述
桌面版运行后页面空白,内容未加载。

填坑:

打包配置要用相对路径
在这里插入图片描述
vite.config.ts文件中的base要改成'./',之前加了项目名

二、接口请求报错

后端接口请求失败
在这里插入图片描述

填坑

axios的baseUR需要配置请求路径(http://www.baidu.com)

axios.defaults.baseURL = 'http://www.baidu.com' 
三、路由跳转失败

登录成功后使用router.push('/index')跳转到首页,未跳转成功
在这里插入图片描述
网上都是路由模式要用Hash模式,但我项目本来就Hash,经过不断排查,是setCookie()方法出了问题,因为是electron不支持这种方式

 /*** 设置token*/setToken(token: string) {this.oauthToken = tokensetCookie('oauthToken', token)}/*** 设置Cookie* @param {string} key* @param {*} val* @param {*} path*/export function setCookie(key: string, val: string, path?: string) {if (!path) path = "/";document.cookie = key + "=" + val + "; expires=Session; path=" + path;  //设置cookie
}
填坑

用sessionStorage.setItem代替将setCookie(),sessionStorage.getItem代替getCookie()

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

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

相关文章

postcss安装和使用(详细)

1,安装postcss: 在此之前需要安装有node.js 第一步 命令:cnpm install postcss-cli -g 第二步 命令:cnpm install postcss –g 推荐内容 2,下载autoprefixer插件,并创建postcss.config.js文件并写入配置代码 autoprefixer插件…

习题2-5 求平方根序列前N项和

本题要求编写程序,计算平方根序列 的前N项之和。可包含头文件math.h,并调用sqrt函数求平方根。 输入格式: 输入在一行中给出一个正整数N。 输出格式: 在一行中按照“sum S”的格式输出部分和的值S,精确到小数点后两位。题目保证计算结果不…

西南交大swjtu算法实验3.3|穷举法

1.实验目的 通过具体例子学习排列这种典型的穷举算法的求解过程以及程序框架,分析其算法的求解过程,以及如何设计穷举法解决实际问题。通过本实验,理解穷举法的特点以及实际应用中的局限性。 2.实验任务 有n (n>1)个任务需要…

HarmonyOS 应用开发之FA模型与Stage模型应用组件

应用配置文件概述(FA模型) 每个应用项目必须在项目的代码目录下加入配置文件,这些配置文件会向编译工具、操作系统和应用市场提供描述应用的基本信息。 应用配置文件需申明以下内容: 应用的软件Bundle名称,应用的开发…

使用Python实现对word的批量操作

Python在平时写写小工具真是方便快捷,Pyhon大法好。以下所有代码都是找了好多网上的大佬分享的代码按照自己的需求改的。 调用的库为Python-docx、win32com、PyPDF2、xlwings(操作excel)。 因为公司的任务要对上千个word文件进行批量操作&a…

JAVAEE之网络编程

1.网络编程 网络编程,指网络上的主机,通过不同的进程,以编程的方式实现网络通信(或称为网络数据传输)。 当然,我们只要满足进程不同就行; 所以即便是同一个主机,只要是不同进程&am…

【论文阅读】ELA: Efficient Local Attention for Deep Convolutional Neural Networks

(ELA)Efficient Local Attention for Deep Convolutional Neural Networks 论文链接:ELA: Efficient Local Attention for Deep Convolutional Neural Networks (arxiv.org) 作者:Wei Xu, Yi Wan 单位:兰州大学信息…

C语言-文件操作

🌈很高兴可以来阅读我的博客!🌟我热衷于分享🖊学习经验,🏫多彩生活,精彩足球赛事⚽🔗我的CSDN: Kevin ’ s blog📂专栏收录:C预言 1. 文件的作用 …

基于spark的大数据分析预测地震受灾情况的系统设计

基于spark的大数据分析预测地震受灾情况的系统设计 在本篇博客中,我们将介绍如何使用Apache Spark框架进行地震受灾情况的预测。我们将结合数据分析、特征工程、模型训练和评估等步骤,最终建立一个预测模型来预测地震造成的破坏程度,同时使用可视化大屏的方式展示数据的分布…

docker-compose运行springinitializr用来创建springboot2

前言 spring initializr官方的地址是: https://start.spring.io/ ,这是一个用来创建springboot脚手架的一个工具,但是目前这个工具已经更新到springboot3,而我还没学springboot3,目前还想继续创建springboot2,我就想能…

Unity类银河恶魔城学习记录11-10 p112 Items drop源代码

Alex教程每一P的教程原代码加上我自己的理解初步理解写的注释,可供学习Alex教程的人参考 此代码仅为较上一P有所改变的代码 【Unity教程】从0编程制作类银河恶魔城游戏_哔哩哔哩_bilibili ItemObject_Trigger.cs using System.Collections; using System.Collecti…

Gin入门指南:从零开始快速掌握Go Web框架Gin

官网:https://gin-gonic.com/ GitHub:https://github.com/gin-gonic 了解 Gin Gin 是一个使用 Go 语言开发的 Web 框架,它非常轻量级且具有高性能。Gin 提供了快速构建 Web 应用程序所需的基本功能和丰富的中间件支持。 以下是 Gin 框架的一些特点和功能: 快速而高效:…

设计模式-结构型-享元模式Flyweight

享元模式的特点: 享元模式可以共享相同的对象,避免创建过多的对象实例,从而节省内存资源 使用场景: 常用于需要创建大量相似的对象的情况 享元接口类 public interface Flyweight { void operate(String extrinsicState); } 享…

信息工程大学第五届超越杯程序设计竞赛(同步赛)题解

比赛传送门 博客园传送门 c 模板框架 #pragma GCC optimize(3,"Ofast","inline") #include<bits/stdc.h> #define rep(i,a,b) for (int ia;i<b;i) #define per(i,a,b) for (int ia;i>b;--i) #define se second #define fi first #define e…

【C++庖丁解牛】自平衡二叉搜索树--AVL树

&#x1f341;你好&#xff0c;我是 RO-BERRY &#x1f4d7; 致力于C、C、数据结构、TCP/IP、数据库等等一系列知识 &#x1f384;感谢你的陪伴与支持 &#xff0c;故事既有了开头&#xff0c;就要画上一个完美的句号&#xff0c;让我们一起加油 目录 前言1 AVL树的概念2. AVL…

Solidity Uniswap V2 Router swapTokensForExactTokens

最初的router合约实现了许多不同的交换方式。我们不会实现所有的方式&#xff0c;但我想向大家展示如何实现倒置交换&#xff1a;用未知量的输入Token交换精确量的输出代币。这是一个有趣的用例&#xff0c;可能并不常用&#xff0c;但仍有可能实现。 GitHub - XuHugo/solidit…

基础布局之RelativeLayout相对布局

目录 概述一、属性分类二、父容器定位属性2.1 示例12.2 示例2 三、相对定位属性3.1 示例13.2 示例23.3 示例3 概述 相对布局&#xff08;RelativeLayout&#xff09;是一种根据父容器和兄弟控件作为参照来确定控件位置的布局方式。 使用相对布局&#xff0c;需要将布局节点改成…

Spring Boot 使用 Redis

1&#xff0c;Spring 是如何集成Redis的&#xff1f; 首先我们要使用jar包 <dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-data-redis</artifactId></dependency><dependency><gro…

基于ssm校园教务系统论文

摘 要 互联网发展至今&#xff0c;无论是其理论还是技术都已经成熟&#xff0c;而且它广泛参与在社会中的方方面面。它让信息都可以通过网络传播&#xff0c;搭配信息管理工具可以很好地为人们提供服务。针对校园教务信息管理混乱&#xff0c;出错率高&#xff0c;信息安全性差…

Windows 11 专业版 23H2 Docker Desktop 下载 安装 配置 使用

博文目录 文章目录 Docker Desktop准备系统要求 (WSL 2 backend)在 Windows 上打开 WSL 2 功能先决条件开启 WSL 2 WSL下载安装启动配置使用镜像 Image卷积 Volumes容器 Containers 命令RedisMySQLPostGreSQL Docker Desktop Overview of Docker Desktop Docker Desktop 疑难解…