npm create electron-app@latest my-app //my-app 项目名称 //create-electron-vite脚手架 npm create electron-vite@latest my-app 1. 2. 3. 4. 2、选择模板 PS D:\webPro\yunfeng\electron> npm create electron-vite@latest electron
在省去了手动融合Electron和Vite繁琐过程的同时,还实现了V8字节码、主进程和预加载脚本热更新等非常实用的功能,要比自己从头搭建容易得多。 本教程将electron-vite开发过程详细讲述,希望能够帮助各位省去摸索的时间,少走弯路,快速完成项目开发。Vue技术栈的小伙伴不要错过哟! 本教程也同步推出《2023金秋版:基于...
npm install -D vite-plugin-electron 创建项目入口——主进程 electron引入成功了,可以开始写electron的相关代码了,新建一个src-electron文件用来写electron的代码,在它下面创建一个main.ts文件 用来写主进程代码 // src-electron/main.js const { app, BrowserWindow } = require('electron') const { join } =...
一个命令启动 Vue 与 Electron,使用concurrently包实现并行执行命令,并在后台持续运行 "scripts": {"dev":"vite","serve":"electron .","start":"concurrently \"yarn dev\" \"electron-forge start\""} 因为打包会用到Electron Forge,新增了electron-forge start命令启动 Electron,所以这里就改了 现在执行yarn...
vue3技术性:vite2.1.5 vue3.0 vuex4 vue-router@4 跨端架构:electron^12.0.4 封装工具:vue-cli-plugin-electron-builder UI组件库:element-plus^1.0.2 (饿了么外卖vue3组件库) 报表拖动:sortablejs^1.13.0 图表组件:echarts^5.1.1 现代化计划方案:vue-i18n^9.1.6 ...
目录 前言: 准备工作: 架构设计: 基本代码: 代码结构: 主进程(main.js): 子进程: 工具函数: 消息中心: electron模块: 在vue的全局调用上述几个函数: 脚本: 问题避坑: 搭建上述软件时遇到以下问题: 总结: 前言: 随着前端...
2. 创建一个vite项目 在windows包里调出cmd后执行 npm create vite 3. 安装electron npm install --save-dev electron npm install --save-dev electron@20.0.0 指定版本 注意:在electron21+后调用C++动态库会出现Error: Error in native callback错误,原因:Electron 21 及更高版本将启用 V8 内存隔离区,这将...
《2023金秋版：基于electronvite构建Vue桌面客户端》是一个针对Vue技术栈开发者，使用electronvite框架构建桌面客户端的教程。以下是该教程的一些核心要点：技术背景：Electron：基于Chromium和Node.js，为跨平台应用开发提供了强大支持，尤其在C/S架构需求增长的背景下，其优势愈发明显。桌面应用优势：相比网页...
electron-main:主进程目录。 electron-preload:预加载代码目录,主要是定义桥接通信。 其他文件:也就是 vue 初始化后的目录。 目录结构这么设计的原因是因为我们使用的 vite-plugin-electron 插件需要使用这样的目录结构,目前还没有提供设置修改。 初始化项目目录 ...
对于Vue技术栈的开发者，本教程特别定制了《2023金秋版：基于electron-vite构建Vue桌面客户端》，而React技术栈的伙伴也有一款相应的教程。通过目录，您可以快速了解教程内容。项目创建使用yarn命令，通过填写项目名（如electron-vite-vue-app）、选择Vue框架，设置基础配置后，开始逐步构建。比如，我们会精简...