Vite+Electron快速构建一个VUE3桌面应用(三)——打包 二. 思路 先说结论,重点还是在于mainWindow.loadURL()。 打包后还是加载http://localhost:3000是无法运行的,因此,此处需要先用vite打包好,然后使用electron-builder加载vite打包后的文件进行打包。 为了代码能够根据不同环境在运行时加载http://localhost:3000,在...
vue3作为国内主流开发框架,而vite又是vue团队推荐打包工具,在大多数的项目中都是部署在服务器上,通过http://协议访问ip、域名,但是在一些混合式开发如android或者electron中需要提供的html页面,然后使用file://协议访问。在这样的背景下就需要我们使用vite打包vue3项目支持file://协议访问。通过查找相关资料实现逻辑主要...
npm install -Dvite-plugin-electron 创建项目入口——主进程 electron引入成功了,可以开始写electron的相关代码了,新建一个src-electron文件用来写electron的代码,在它下面创建一个main.ts文件 用来写主进程代码 // src-electron/main.js const { app, BrowserWindow } = require('electron') const { join } = ...
是在https://github.com/electron-vite/electron-vite-vue库的参考下完成的,将此库的文件复制到原本存在的项目中完成打包。 步骤如下: 将electron-vite-vue拷贝到本地 将electron-vite-vue项目中的electron文件夹、electron-builder.json5拷贝到已存在项目根目录下 修改已存在项目的package.json在devDependencies下面添...
先用Vite创建一个Vue3的工程,这就是你的实际项目工程 接着安装几个Electron相关的依赖,最终我的工程下的依赖情况如下: 代码语言:javascript 复制 "@vue/compiler-sfc":"^3.0.0","vite":"^1.0.0-rc.9","vue":"^3.0.2","vue-router":"^4.0.0-rc.1","electron":"^11.0.2","electron-builder":"...
【分享】Vite+Vue3+Electron打包桌面应用_哔哩哔哩_bilibili ⨯ Application entry file "electron\main.js" in the "D:\vs2024proj\electron_vite_ts_demo_sunny\electron-vite-demo-sunny\dist_electron\win-ia32-unpacked\resources\app.asar" does not exist. Seems like a wrong configuration. failedTask=...
一. 简介 上一篇文章Vite+Electron快速构建一个VUE3桌面应用(二)——动态模块热重载完成了开发时的动态模块热重载功能,现在是时候来看看怎么完成最后一步——打包了。 源码:https://github.com/Kuari/Blog/tree/master/Examples/vite_electron/vite_electron_3 系列文章:
Electron + VUE3 + 实现桌面级应用程序前端模板 前言 electron 用的版本是25.6.0 打包工具使用:vite vue版本:3.3.4 虽然是vue3.x版本,但是大部分的代码还是采用了vue2.x的语法去编写,这样让没有学过vue3的同学们,看起来更直观一点 Electron是一个用于构建跨平台桌面应用程序的开源框架,由 GitHub 开发和维护。
最近开发了一个项目,头一回使用electron,很多写代码的习惯都还是原来的。 有个功能是切换菜单,UI是要按钮变色,本来想用icon应付一下,但是又不想去收集icon,就用了他UI的图片。没想到啊!给我炸出一个坑来了 // ts数据是这样的{title:"首页",activeIcon:Icon_0_0,// 这是后来的想法,这个方式需要在vite-en...