先用Vite创建一个Vue3的工程,这就是你的实际项目工程 接着安装几个Electron相关的依赖,最终我的工程下的依赖情况如下: "@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": "^22.9.1","elec...
先用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":"^...
从渲染器进程发送到主进程,使用 ipcRenderer.send 发送消息,然后使用 ipcMain.on 接收。 在下面的示例中,我们将从渲染器进程发送一个网址到主进程,主进程拿到网址,打开网址。 1、渲染进程页面(具体的vue页面) // renderer.js// vue页面触发打开网站按钮事件const handleOpen = (url) => {window.electronAPI.op...
electron与vite同时启动时第一次会抛错找不到页面,解决方式:先运行vite之后再执行electron dev环境下electron无法监听到vite项目文件热重载,解决方式:1.热重载构建vite项目,2.使用electron-reload监听文件变化 子进程无法调用主进程api,解决方式:1.electron/remote(没研究出来),2.ipcMain和ipcRenderer electron在build时...
1. 现实问题 得益于 Vite 卓越的前端开发体验,越来越多的 Electron 项目也开始应用它来构建开发。翻阅各种社区资源可以发现很多基于 Vite 搭建的 Electron 开发模板,但都存在着一些共同的问题: 配置相对复杂,繁琐 需要辅助脚本来配合编译开发 无法举一反三,自主选择前端框架(Vue、React 和 Svelte 等) ...
electron-vite旨在解决这些问题,为 Electron 提供更快、更精简的开发体验。 这个脚手架虽然说的很厉害,但是还是有一些不足,比如对vue项目初始化时的配置不如官方的精细。还需要自己手动配置自己喜爱的开发方式。但是瑕不掩瑜,它依然是目前我认为搭建electron配置最少的方式了。
作者:周文武,Electron+Vue3+Vite搭建一个桌面应用:现实问题得益于Vite卓越的前端开发体验,越来越多的Electron项目也开始应用它来构建开发。翻阅各种社区资源可以发现很多基于Vite搭建的Electron开发模板,但都存在着一些共同的问题:配置相
如何优雅的创建Electron + Vue3 + Vite项目 错误示范 先创建vite项目 代码语言:shell 复制 yarncreate vite 然后加入electron依赖 代码语言:shell 复制 yarnadd--develectron concurrently cross-env electron-builder wait-on 之后就是无尽的报错 正确示范
简介:基于Vite+Vue3+Electron整了一个桌面应用模板 前言: 随着前端的更新迭代,基于js/ts开发的桌面应用框架也越来越多,从heX,electron,nwjs到tauri,Qt,以及Rn和flutter也有桌面应用业务。 而今天的主角正是electron,作为一款2013年推出的桌面应用开发框架,其运行于Chromium内核以及node平台,使得开发者可以使用html+css...
由于electron配置相对简单,我们先配置好vue再配置electron。 vue3环境搭建 由于我们使用vite,直接执行npm init vite ${项目文件夹} -- --template vue即可,会自动生成模板项目,然后进去执行npm install。可以看到,这个模板项目很简单,只需要一个配置文件vite.config.js就够了。