位置: IT常识 - 正文
vue整合electron 实现pc端应用程序(vue整合electron)
发布时间：2024-01-29推荐整理分享vue整合electron 实现pc端应用程序(vue整合electron)，希望有所帮助，仅作参考，欢迎阅读内容。
文章相关热门搜索词:vue整合elementui,vue3整合elementplus,vue整合element,vue+electron,Vue整合springboot,electron结合vue,vue整合electron,Vue整合springboot,内容如对您有帮助，希望把文章链接给更多的朋友！
准备工作
下载 electron-v9.4.4-win32-ia32.ziphttps://npm.taobao.org/mirrors/electron/9.4.4/electron-v9.4.4-win32-ia32.zip解压放到 C:\Users\Admin\AppData\Local\electron-builder\Cache 目录下
下载 winCodeSignhttps://npm.taobao.org/mirrors/electron-builder-binaries/winCodeSign-2.6.0/解压放到C:\Users\Admin\AppData\Local\electron-builder\Cache\winCodeSign\winCodeSign-2.6.0目录下（没有的话，自己创建winCodeSign-2.6.0）
下载/nsis-3.0.4.1https://npm.taobao.org/mirrors/electron-builder-binaries/nsis-3.0.4.1/解压放到C:\Users\Admin\AppData\Local\electron-builder\Cache\nsis\nsis-3.0.4.1 目录下（没有的话，自己创建nsis-3.0.4.1）全局安装electron：npm install -g electron最后在检查一下是否都安装完毕准备工作做好之后就可以开始创建项目了1.创建vue项目
vue create 项目名
这里我直接选的默认
? Please pick a preset: Default ([Vue 3] babel, eslint)
2.cd 项目名 进入刚刚创建的vue项目
3.vue add electron-builder 将electron添加至项目
4.npm run electron:build运行一下打包命令 测试一下打包是否存在问题
如上：我整体创建下来的话是没有任何报错的
打包后的文件在：项目名\dist_electron 下有一个.exe文件 elapp Setup 0.1.0.exe 双击就可以运行了
5.项目启动命令：npm run electron:serve
接下来就可以愉快的进入开发流程啦
上一篇：DedeCMS小说连载模块内容页空白是怎么回事？怎么解决？(小说连载阅读安卓版下载)
下一篇：php变量如何命名(php变量名称中可以包含哪些元素)
