vue-electron相关问题的解决方案

stubborn丶lili

已于 2023-05-18 15:40:15 修改

阅读量1k

点赞数

分类专栏： electron 文章标签： electron

于 2023-03-15 17:52:02 首次发布

本文链接：https://blog.csdn.net/qq_43340606/article/details/129560734

版权

electron 专栏收录该内容

4 篇文章

订阅专栏

文章介绍了在开发Electron应用时遇到的依赖安装失败、版本不匹配、启动报错、打包错误等常见问题，以及对应的解决方案，包括设置淘宝镜像源、全局安装指定版本的包、调整package.json的依赖结构、更改electron-builder镜像源等方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

ps: 在安装依赖时一定要先设置淘宝镜像源

设置: yarn config set registry https://registry.npm.taobao.org/
查看: yarn config get registry

问题: 安装electron依赖失败, 是因为需要全局安装electron

解决: 全局安装指定版本的包 (可以选择你想要的版本: 连接)

yarn global add electron@^11.5.0

问题: 安装其他依赖失败

解决: spectron是electron官方推荐的一个测试包, 该版本与electron版本不匹配, 升级spectron包, 或者删除

问题: 启动程序报错

解决: 添加json.stringify()

问题: 打包报错ERROR in unknown: Unexpected token (171:63)

解决: package.json的electron-store依赖不小心放到devDependencies里面去了，改回dependencies即可

问题: 打包报错 Error: Unresolved node modules: bufferutil, utf-8-validate

解决: 删除本地的electron-builder 使用全局的electron-builder来进行打包

yarn remove electron-builder
yarn add global electron-builder

问题: 安装依赖报错 electron\install.js:54 throw err ^

解决: 安装淘宝镜像

npm install -g cnpm -registry=https://registry.npm.taobao.org
yarn add cnpm -g --registry=http://registry.npm.taobao.org

问题: Package "electron-builder" is only allowed in "devDependencies". Please remove it from the "dependencies" section in your package.json.

解决: 如下所示, 移动一下安装包位置

  "devDependencies": {
    "electron": "^8.2.1",
    "electron-builder": "^22.4.1"
  },
  "dependencies": {
  }

6. 问题：打包成exe

a. DOS 下，输入 npm install electron-packager -g全局安装我们的打包神器：

yarn addd global electron-packager

b. 将打包的命令设置在package.json的script中

"scripts": {
    "start": "electron .", 
    "packager": "electron-packager ./ Printer --platform=win32 --arch=x64  --overwrite"
  },

c. 输入打包命令

yanr run  packager

d. 最终效果

问题: 打包报错

解决:

//将 Electron 镜像源设置为淘宝镜像源
npm config set ELECTRON_MIRROR=https://npm.taobao.org/mirrors/electron/
//将 Electron-builder 镜像源设置为淘宝镜像源
npm config set ELECTRON_BUILDER_BINARIES_MIRROR=http://npm.taobao.org/mirrors/electron-builder-binaries/

解决(二者选其一): 在.npmrc中进行设置electron_mirror路径的方式。

win+r 找到这个文件