electron-builder 离线打包，以及打包完成白屏问题

最新推荐文章于 2025-10-26 23:34:57 发布

原创最新推荐文章于 2025-10-26 23:34:57 发布 · 3.5k 阅读

4 ·

CC 4.0 BY-SA版权

文章标签：

#vue.js

前端专栏收录该内容

1 篇文章

订阅专栏

本文分享了在遇到网络限制时，如何使用electron-builder进行离线打包的解决方案，避免了因网络问题导致的打包失败。文章提供了具体步骤，包括使用npm命令分别打包主进程和渲染进程，最后通过electron-builder完成exe文件的生成。

electron-builder离线打包

这几天帮朋友做个windows上的桌面程序，发现可以使用vue进行开发，最后使用electron进行桌面程序的打包。但是打包的时候遇到了很大的坑，由于网络原因，一直打包不过，在即将崩溃之时，发现了一篇关于使用electron-builder离线打包的博客，最终解决了我的问题。
下面我放上这篇博客的地址：

https://blog.youkuaiyun.com/u010982507/article/details/101236913

打包完成白屏问题解决

使用

npm run pack:main

和

npm run pack:renderer

进行打包dist。
最后再使用electron-builder命令进行exe的打包。

9 条评论

赫卡夹 2020.09.27
可以求一下具体的命令吗？
- wFitting回复赫卡夹 2020.09.27
  https://gitee.com/junweiw/electron-article 这是Gitee地址，关于配置方面，可以做下参考
- wFitting回复赫卡夹 2020.09.27
  "pack:main": "cross-env NODE_ENV=production webpack --progress --colors --config .electron-vue/webpack.main.config.js", "pack:renderer": "cross-env NODE_ENV=production webpack --progress --colors --config .electron-vue/webpack.renderer.config.js",
- 赫卡夹回复wFitting 2020.09.27
  请问第一二步在package.json里对应的指令是什么呢？
- wFitting回复赫卡夹 2020.09.27
  第一步：npm run pack:main 第二步：npm run pack:renderer 第三步：在项目目录下执行 electron-builder .
- 赫卡夹回复wFitting 2020.09.27
  嗯嗯，两条指令对应得命令
- wFitting回复赫卡夹 2020.09.27
  是electron- builder的命令吗？