Electron+Vite+Vue项目中,如何监听Electron的修改实现和Vue一样的热更新?[特殊字符]

在Vite+Vue中,Vue的代码变化,Vite会自动监听,并且实时更新,这是Vite实现的热更新

但是在Electron+Vite+Vue框架中,如果Electron中的主线程代码被修改了,则需要手动重启应用,来应用更新的内容,在开发环境下着实不方便,那么有没有什么方式可以让Electron的主线程也可以热更新呢?

1.electron热更新方案

  • electron-reload
  • electron-updater等等库,这些库的功能也更加强大,但是使用nodmeon足够简便,也已经可以满足大部分需求了,如果nodemon
  • tsup
    无法满足需求时,可以再去使用tsup等工具做此功能也不迟- ...

本篇文章使用的是nodemon,不需要各种配置,手动插入应用重启的过程,自动重启等等,只需要在启动命令中加上nodemon即可

2.使用方法

cmd 复制代码
nodemon --watch electron/ --exec electron .
  1. nodemon: 监听文件的改动,从而进行指定操作
  2. --watch electron/: 设置nodemon监听的文件/文件夹,当指定的文件/文件夹的文件或目录发生变化时,则会自动触发nodemon更新
  3. --exec electron .: nodemon监听到指定的文件/文件夹改动后指定的命令,这里的意思为启动整个electron应用

3.nodemon是什么?

nodemonNodejs开发的工具,核心功能就是监视文件系统中的文件变化,并且自动重启Nodejs程序

4.总结

本篇文章介绍了使用nodemon实现electron的简便热更新功能,虽然可以使用electron-reload,electron-updater等等库,这些库的功能也更加强大,但是使用nodmeon足够简便,也已经可以满足大部分需求了

如果nodemon无法满足需求时,可以再去使用tsup等工具做此功能也不迟,关键就在于使用nodemon足够方便,使用简单😁

相关推荐
why技术11 分钟前
AI Coding开始进入第四个时代,我还没上车呢!
前端·人工智能·后端
大家的林语冰1 小时前
CSS 已死?DOM 性能黑洞!Pretext 排版革命让你在文本间跳舞,没有 DOM 也能纵享丝滑~
前端·javascript·css
vipbic1 小时前
我也该升级了,陪伴了我7年的博客
前端
Lee川1 小时前
RAG 实战:从一篇掘金文章出发,拆解检索增强生成的全链路
前端·人工智能·后端
Lee川2 小时前
MCP 高德地图实战:当 AI 学会使用工具,一个协议如何重塑大模型的行动边界
前端·人工智能·后端
ZC跨境爬虫2 小时前
跟着 MDN 学CSS day_14:(尺寸调整技能测试与实战解析)
前端·css·ui·html·tensorflow
kyriewen2 小时前
用魔法打败魔法:我让AI替我去面试前端岗,AI面试官给我打了92分,还发了offer
前端·javascript·面试
IT_陈寒2 小时前
Redis批量删除踩了坑,原来DEL命令不是万能的
前端·人工智能·后端
lichenyang4532 小时前
鸿蒙聊天 Demo 练习 06:AI 思考气泡与 MVVM + Controller 结构重构
前端
Lkstar3 小时前
Vue keep-alive 原理全解:LRU 缓存策略、源码级理解
前端·vue.js·面试