在src/main.ts中,设置 Electron 的主进程: import{app,BrowserWindow}from'electron';importpathfrom'path';functioncreateWindow(){constwin=newBrowserWindow({width:800,height:600,webPreferences:{contextIsolation:true,enable
"build": "rimraf dist && vite build && electron-builder" }, "dependencies": { "vue": "^3.2.25" }, "devDependencies": { "@vitejs/plugin-vue": "^2.3.1", "electron": "^18.2.0", "electron-builder": "^23.0.3",
base: path.resolve(__dirname,'./dist/'),//新增plugins: [vue()] }) (2)index.js 创建一个新的文件index.js,需要注意的是,该内容中index.html的加载路径跟electron官网给的配置不同 //main.js//控制应用生命周期和创建原生浏览器窗口的模组const { app, BrowserWindow } = require('electron') const ...
数据交互流程 在集成 Electron 和 Vue 3 的过程中,了解数据如何在不同层之间流动是关键。我们将通过以下简单的代码实现一个基础的消息传递功能。 // main.js (主进程)const{app,BrowserWindow,ipcMain}=require('electron');ipcMain.on('asynchronous-message',(event,arg)=>{console.log(arg);// 打印来自渲染...
electron项目和web项目的区别 electron核心我们可以分成2个部分,主进程和渲染进程。主进程连接着操作系统和渲染进程,可以把她看做页面和计算机沟通的桥梁。渲染进程就是我们所熟悉前端环境了。只是载体改变了,从浏览器变成了window。传统的web环境我们是不能对用户的系统就行操作的。而electron相当于node环境,我们可以在项...
electron-main:主进程目录。 electron-preload:预加载代码目录,主要是定义桥接通信。 其他文件:也就是 vue 初始化后的目录。 目录结构这么设计的原因是因为我们使用的 vite-plugin-electron 插件需要使用这样的目录结构,目前还没有提供设置修改。 初始化项目目录 ...
electron-main:主进程目录 electron-preload:预加载代码目录,主要是定义桥接通信 其他文件:也就是 vue 初始化后的目录 目录结构这么设计的原因是因为我们使用的 vite-plugin-electron 插件需要使用这样的目录结构,目前还没有提供设置修改。 初始化项目目录
vue init simulatedgreg/electron-vue electron-vue-typescript-koa 然后根据对应的选项选择你需要的配置即可 这边有个小问题,它自动生成的项目electron版本是1,安装是会找不到那个包,这边我们手动在package.json中将版本换为最新的,具体如下 "electron": "^3.0.3", ...
vite-plugin-electron插件是将 vite 和 electron 结合在一起的,可以让我们非常方便的结合 electron 和 vue,需要做一些指定的配置。 初始化electron项目 新建目录文件electron-main/index.ts主进程目录和文件、electron-preload/index.ts预加载目录和文件 // electron-main/index.ts ...
electron-myui JavaScript electron 项目工程模板 最近更新:4年多前 107 367 115 xdh-web JavaScript 基于Vue + ElementUI 的web项目工程框架,专注于中台系统快速搭建,框架已在多个项目实战检验。 特色:搭配代码生成器,可生成api调用、vuex管理、模拟数据代码; 内置常用超过70个组件、扩展;子模块支持前端微服务,可以批...