Electron:Electron整合vue

主要思路:分别启动两个进程,一个是vue,另一个是electron。然后在electron通过loadURL去引入vue的主页面。但怎么才能将这两个项目整合成一键启动呢?请看后文!

vue几个插件

json 复制代码
electron:用前端技术开发桌面应用的框架
electron-builder:electron打包框架

concurrently:可以同时执行多个命令
wait-on:监听某个端口是否有服务,有服务则放行,没服务则阻塞

cross-env:设置和读取环境变量,实现类似于springboot的profile功能

整合成一键启动

json 复制代码
"scripts": {
	// 将启动vite和electron整合成一条命令,一键启动
    "electron:serve": "concurrently -k \"npm run dev\" \"npm run electron\"",
    // vite项目是用3000端口,监听3000端口执行vite运行成功,然后在启动electron
    "electron": "wait-on tcp:3000 && cross-env NODE_ENV=dev electron .",
    // 启动vite项目
    "dev": "vite"
  }

打包

TODO

相关推荐
MXN_小南学前端1 小时前
watch详解:与computed 对比以及 Vue2 / Vue3 区别
前端·javascript·vue.js
2601_949814692 小时前
Docker部署Spring Boot + Vue项目
vue.js·spring boot·docker
Mr Xu_2 小时前
从后端数据到前端图表:深入解析 reduce 与 flatMap 的数据整形实战
前端·javascript
喜欢吃鱿鱼3 小时前
DES加解密(附带解决转义问题)-VUE
开发语言·前端·javascript
Lkstar4 小时前
逐步搞懂 Vue 的 patchChildren,把 Diff 算法拆给你看
vue.js
Jenlybein4 小时前
速学 VS Code 插件开发入门,客制化你的开发体验
前端·javascript·visual studio code
ZC跨境爬虫5 小时前
UI前端美化技能提升日志day7:(原生苹方字体全局适配+合规页脚完整像素级落地)
前端·javascript·ui·html·交互
好运的阿财5 小时前
OpenClaw工具拆解之tts+web_search
前端·javascript·python·ai·ai编程·openclaw·openclaw工具
whinc5 小时前
Node.js技术周刊 2026年第17周
前端·javascript
nbsaas-boot5 小时前
100万门店级分货系统架构设计
前端·javascript·vue.js