1、直接添加electron-build集成插件,选择最新版本,目前13.0.0 vue add electron-builder 你会发现在原来的基础目录有些变化。 运行 npm run electron:serve 打包 npm run electron:build 首次运行的时候会比较慢,是因为项目中有个检查接口访问外网不通,所以会有一些卡顿,后面的话删掉就可以了,具体细节可以看下篇的项...
3. 主进程配置 (electron/main.js) const{app,BrowserWindow,ipcMain}=require("electron");constpath=require("path");functioncreateWindow(){constwin=newBrowserWindow({width:800,height:600,webPreferences:{preload:path.join(__dirname,"preload.js"),// 预加载脚本contextIsolation:true,// 启用上下文隔离nod...
在src/main.ts中,设置 Electron 的主进程: import{app,BrowserWindow}from'electron';importpathfrom'path';functioncreateWindow(){constwin=newBrowserWindow({width:800,height:600,webPreferences:{contextIsolation:true,enableRemoteModule:false,nodeIntegration:false,preload:path.join(__dirname,'preload.js'),},}...
由于Electron更新迭代非常快,加上Vue3已经发布很长一段时间了,所以我们很有必要将我们的项目升级一下,所以这里就利用electron+Vue3搭建一个万精油的项目框架! 1.初始化项目 我们需要先借助Vite初始化一个Vue3+TS 的项目,后面我们在逐步添加electron,在任何一个文件夹下: 执行命令: npm create vite@latest my-vue...
项目搭建 Vue CLI Plugin Electron Builder 是基于Vue Cli的,因此项目的搭建非常方便。 创建vue项目 首先,安装:npm i @vue/cli -g 接着,创建项目:vue create tasky-vue 运行该命令后,会有一系列选择项让我们进行选择,在我们这个项目中,选择如下:
之前也有使用vite2+vue3+electronc创建桌面端项目,不过vue-cli-plugin-electron-builder脚手架插件构建的项目electron版本只有13.x。如今electron版本都到了24,显然不能再用之前的方法创建项目了。于是闲暇时间就捣鼓了electron24+vite4搭建桌面程序,中间踩了不少坑,现记录如下,希望对大家有所帮助~~ ...
Vue3项目整合Electron 第一步安装:VUE3 安装vue3脚手架 npm install -g @vue/cli 1. 安装yarn,并设置淘宝源 npm install -g cnpm --registry=https://registry.npm.taobao.org 1. 设置ELECTRON_MIRROR,加速electron的预编译 npm config set ELECTRON_MIRROR=http://npm.taobao.org/mirrors/electron/ ...
一、项目结构与环境搭建1. 初始化项目首先，使用 Vue CLI 创建一个新的 Vue 3 项目，并集成 Electron。bash深色版本# 安装 Vue CLI（如果尚未安装）npm install -g @vue/cli# 创建 Vue 3 项目vue create my-electron-app# 进入项目目录cd my-electron-app# 添加 Electron 支持vue add electron-builder2. ...
作者:周文武,Electron+Vue3+Vite搭建一个桌面应用:现实问题得益于Vite卓越的前端开发体验,越来越多的Electron项目也开始应用它来构建开发。翻阅各种社区资源可以发现很多基于Vite搭建的Electron开发模板,但都存在着一些共同的问题:配置相