本次开发使用了electron-vite-react,具体构建和配置就是用它的默认配置就好了,值得注意的是,本次需要要做三个窗体,一个主窗体,一个截屏窗体,一个是图片展示窗体,于是索性就引入react-router-dom了。 先来安装一下: 1 2 3 4 5 git clone https://github.com/electron-vite/electron-vite-react pnpm add rea...
项目地址:https://github.com/topul/electron-vite-react 创建vite应用 yarn create @vitejs/app electron-vite-react --template react cd electron-vite-react yarn 安装electron打包工具 yarn add --dev @electron-forge/cli 当打包工具安装完成后,我们设置一下electron打包配置,然后我们就可以通过electron-forge进...
Electron Forge was terminated. Location... 本地运行起来的桌面窗口未关闭,先关了再来打包。 引用react + vite 打包后的 dist 文件白屏 react + vite build 打包后的文件,js 和 css 资源引用路径都是绝对路径,导致 electron 中加载不到对应的文件。 解决办法,配置 vite.config.js 中的 base: './' 为...
然后使用vite创建一个react或者vue程序: yarn create vite 1. 按照提示选择react或者vue: 创建完成后,进入项目并安装依赖: 然后安装electron依赖: yarn add concurrently electron cross-env -D 1. 安装electron打包依赖:并创建打包配置文件 yarn add --dev @electron-forge/cli npx electron-forge import 1. 2. ...
Go后端 + Web前端: Wails的核心模型是将应用程序逻辑用Go语言编写,而用户界面则使用标准的Web技术(HTML, CSS, JavaScript)构建,并且可以集成任何现代前端框架(如React, Vue, Svelte, Lit, Vanilla JS等) 。 系统WebView渲染: 这是Wails与Electron的关键区别。Wails不捆绑浏览器引擎,而是利用操作系统提供的原生WebVi...
所以我们脚手架的选型就是自己来造一个Electron的项目架构,从package.json开始,用Vite+Electron+React构建一个Electron项目。 网络模块选型 Electron发送HTTP请求的方案有很多。 第一种就是渲染进程和主进程分别用相应的请求HTTP请求工具来进行网络请求,比如渲染进程可以使用fetch,主进程用net模块。这种方案的优点就是可以...
Electron Forge 和 Electron Builder：这两个工具可以帮助打包和发布Electron应用，简化了构建过程中的许多复杂步骤。调试工具：Electron支持Chrome DevTools，方便开发者调试渲染进程；同时也提供了专门用于调试主进程的工具。应用示例 Electron已经被用来构建了很多知名的桌面应用，包括但不限于：Visual Studio CodeSlack ...
vite.renderer.config.ts Update config to attempt to get the project to build Apr 28, 2024 vitest.config.ts Add vitest config Oct 19, 2023 Repository files navigation README Electron React Starter Electron desktop application starter Building Blocks Electron with Electron Forge React Typescript Reac...
If you prefer Vite's project structure, thenvite-plugin-electronis more suitable for you. vite-plugin-electron-renderer,vite-plugin-electron-preloadapplies toElectron⚡️ViteandElectron Forge. Due to the nature of Vite, they are currently not perfect and they are experimental plugins. If one ...
yarn electron-forge package 如果一切正常的话应该会在1-5分钟内打好包,如果超过这个时间,很可能是electron下载问题,请参照Step0中的步骤设置electron的下载镜像。 我们会在根目录下得到一个out文件夹: 可执行文件在/out/electron-vite-react-ts-win32-x64/electron-vite-react-ts.ext,双击该文件即可执行。