做桌面端用了flutter发现各种问题,其中svga透明通道和适配第三方游戏等等都是用h5兼容来做,麻烦的很,最主要的是flutter的初衷是同时做app和桌面端,但如果只是用flutter做桌面端那么性价比太低且兼容性问题太多,因此推荐使用electron来做桌面端应用,以现有的电脑配置来说,只要你的代码不要写的太烂,在用户的体验中感受...
创建项目可参考:vue3+ts项目构建 安装electron相关依赖 npm install -D electron electron-builder electron-devtools-installer vite-plugin-electron vite-plugin-electron-renderer rimraf 新建electron-main/index.ts文件 import { app, BrowserWindow } from "electron"; import* as path from "path";//本地启动的...
简介:Vue3 Vite electron 开发桌面程序 Electron是一个跨平台的桌面应用程序开发框架,它允许开发人员使用Web技术(如HTML、CSS和JavaScript)构建桌面应用程序,这些应用程序可以在Windows、macOS和Linux等操作系统上运行。 Electron的核心是Chromium浏览器内核和Node.js运行时环境。Chromium内核提供了现代浏览器的功能,例如HTML...
我们需要先借助Vite初始化一个Vue3+TS的项目,后面我们在逐步添加electron,在任何一个文件夹下: 执行命令: npm create vite@latest my-vue-app -- --template vue-ts 安装依赖: npm install 运行项目: npm run dev 这样一个最简单的Vue3 + TS + Vite的前端项目就初始化好了。
所以开发一个Vite+Vue3+Electron的脚手架的需求日趋强烈 我前段时间做了一个, 但是发现了一些与Vite有关的问题, 比如:Vite会把开发环境的process对象吃掉的问题 这对于web项目来说问题不大,但对于我们的Electron项目来说,就影响很大了 今天我就把这个思路和实现方式的关键代码发出来供大家参考, ...
ts: ^4.9.3 electron: ^23.2.1 二、过程 1. 搭建vite+vue-ts的项目 yarn create vite@ vuets_electron --template vue-tscd./vuets_electron yarn install && yarn dev AI代码助手复制代码 2. 接入electron 为了保证electron能够正常安装,在vuets_electron的根目录下创建.npmrc, 设置一下electron的镜像源 ...
1.置顶 全屏,退出,最小化 2.通信 3.electron实现点:开机自启,置顶窗口,黑夜模式,悬浮窗,用于定时提醒,优化的窗口拖动,优雅丝滑的改变窗口大小和位置显示界面,自定义安装,以及自定义图标,最小化,自定义托盘。 4.node 包管理工具nvp 1.vite.config.ts配置https://blog.csdn.net/oBoLuoMi1/article/details/1310...
我们需要先借助Vite初始化一个Vue3+TS 的项目,后面我们在逐步添加electron,在任何一个文件夹下: 执行命令: npm create vite@latest my-vue-app -- --template vue-ts 安装依赖: npm install 运行项目: npm run dev 这样一个最简单的Vue3 + TS + Vite的前端项目就初始化好了。 2.安装Electron相关包 初始...
要将现有的Vue 3 + TypeScript + Vite项目集成到Electron中,你可以按照以下步骤进行: 1. 安装Electron及相关依赖 首先,你需要在你的Vue 3项目中安装Electron及其相关依赖。打开终端,在项目根目录下运行以下命令: bash npm install electron --save-dev 同时,你还需要安装electron-builder来简化打包过程: bash npm...
上段代码主要是一个入口文件,我们把创建创建窗口、创建监听事件、创建系统托盘等操作都风窗到了 window.ts 文件中,这里重点理解下面三个方法: window.listen() window.createWindows({ isMainWin: true }) window.createTray(); 3.2 新建 electron-main/window.ts 文件 前面的 index.ts 只是主进程的入口文件,接...