当前位置:   article > 正文

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

electron打包后路由窗口无法加载出来

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

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

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

填坑:

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

二、接口请求报错

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

填坑

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

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

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

 /**
     * 设置token
     */
    setToken(token: string) {
      this.oauthToken = token
      setCookie('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
}
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
填坑

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

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/我家自动化/article/detail/354347
推荐阅读
相关标签
  

闽ICP备14008679号