process.env.VITE_DEV_SERVER_URL : join(process.env.ROOT, 'dist/index.html')//配置参数const defaultConfig ={ id:null,//窗口唯一idbackground: '#fff',//背景色route: '',//路由地址urltitle: '',//标题data:null,//传入数据参数width: '',//窗口宽度height: '',//窗口高度minWidth: '',//...
在渲染进程中,直接调用某个方法即可打开新窗口。 默认打开的新窗口是一个子窗口。 打开新窗口方法可以接收参数。 可以传入路由地址,新窗口渲染此路由地址页面。 可以传入窗口样式,如宽高、背景色、是否显示默认菜单栏等等。 可以单独关闭当前新打开的窗口。 上面几点需求大致就是我们此次打开新窗口需要实现的功能,当然,...
vite --config vite.config.electron.ts:指定vite运行时的配置文件。 {"name":"electron_vite","private":true,"version":"1.0.0","main":"dist-electron/main.js","type":"commonjs","scripts": {"dev":"chcp 65001&&vite","build":"vue-tsc && vite build","preview":"vite preview","electron:...
实现功能的第一步，是通过封装方法来简化打开新窗口的操作。在主进程的入口文件 `index.ts` 中，我们可以设计专门的函数来创建窗口、事件监听和系统托盘功能。接着，创建 `window.ts` 文件，该文件将包含具体实现窗口创建、事件监听和系统托盘管理的函数。这些函数将与渲染进程协同工作，确保应用在不同窗...
1、执行如下命令创建一个新的Vite项目: $ yarn create vite 输入项目名称:electron-client,选择框架:Vue,之后选择使用JavaScript。 2、进入项目根目录: $cdelectron-client 3、安装项目依赖: $ yarn add --dev electron concurrently cross-env electron-builder wait-on ...
首先,介绍下vite和Electron。 Vite是一种新型前端构建工具,能够显著提升前端开发体验。由尤大推出,其发动态表示“再也回不去webpack了...” Electron是一个使用 JavaScript、HTML 和 CSS 构建桌面应用程序的框架。 嵌入Chromium和Node.js到二进制的 Electron 允许您保持一个 JavaScript 代码代码库并创建 在Windows上...
跟src有个同级的目录electron,electron下有个main.ts这个文件是主要的文件,修改桌面端页面或者配置啥的,都可以在这里配置(可配置顶部的菜单显不显示,配置菜单,当前默认窗口的视口大小,是否居中显示等) electron-->main.ts functioncreateWindow(){//部分代码if(VITE_DEV_SERVER_URL){//加载链接(我们可以直接将h5的...
封装创建窗口的方法 function createWindow(): void { const mainWindow = new BrowserWindow({ width: 900, height: 670, // 默认隐藏窗口 show: false, // 自动隐藏菜单 autoHideMenuBar: true webPreferences: { // 配置预加载脚本 preload: join(__dirname, '../preload/index.js') ...
项目改造:改造项目结构,修改 vite.config.js & electron/main.js 中的相关配置,以使项目能自动加载所需第三方包,并设计出多页面应用 通信:electron 与 vue 之间的 IPC 通信 数据库设计: SQLite 初始数据结构 项目改造 删除文件 删除src 目录下 main.js、App.vue、style.css ...