个人纪录-Electron安装失败解决办法

一、初始化项目

powershell 复制代码
npm init
或
yarn init
初始化完文件
package.json 复制代码
{
  "name": "electron-test",
  "version": "1.0.0",
  "description": "Hello Electron!",
  "main": "main.js",
  "author": "LiPingAn",
  "license": "MIT",
  "dependencies": {
    "electron": "^37.2.3"
  }
}

二、解决文件占用问题

  1. Electron 下载失败 (ReadError)

    • 错误信息:ReadError: The server aborted pending request
    • 原因:从 GitHub 下载 Electron 二进制文件时网络中断(可能因网络波动、防火墙或 GitHub 限流)
  2. 文件权限问题 (EPERM)

    • 错误信息:EPERM: operation not permitted, rmdir
    • 原因:文件被进程占用导致无法删除(常见于 Windows 系统)
    • 影响路径:node_modules\@electron\get\dist\cjs
  3. 安装流程中断

    • postinstall 脚本 node install.js 执行失败(退出代码 1)
    • 残留文件导致后续清理失败

完整解决方案

第一步:解决文件占用问题
  1. 强制删除残留文件

    powershell 复制代码
    # 关闭所有 Node.js 进程
    taskkill /f /im node.exe
    
    # 强制删除 node_modules
    Remove-Item -Recurse -Force node_modules
  2. 清除 npm 缓存

    powershell 复制代码
    npm cache clean --force
第二步:配置 Electron 镜像加速下载

在项目根目录创建或修改 .npmrc 文件:

ini 复制代码
# .npmrc 配置内容
set electron_mirror="https://npmmirror.com/mirrors/electron/"
set electron_custom_dir="{{ version }}"
第三步:安全重装步骤
  1. 使用镜像安装 Electron

    powershell 复制代码
    # 设置临时环境变量
    $env:ELECTRON_MIRROR="https://npmmirror.com/mirrors/electron/"
    $env:ELECTRON_CUSTOM_DIR="{{ version }}"
    
    # 单独安装 Electron
    npm install electron@25.4.0 --ignore-scripts
  2. 手动执行安装脚本

    powershell 复制代码
    cd node_modules/electron
    node install.js
  3. 完整安装项目依赖

    powershell 复制代码
    cd ../.. # 回项目根目录
    npm install

备选方案(若镜像仍不稳定)

方法 1:手动下载二进制文件

  1. 访问镜像地址下载:

    bash 复制代码
    https://npmmirror.com/mirrors/electron/25.4.0/electron-v25.4.0-win32-x64.zip
  2. 创建缓存目录:

    powershell 复制代码
    mkdir %USERPROFILE%\AppData\Local\electron\Cache
  3. 将下载的 ZIP 文件放入缓存目录并重命名为:

    python 复制代码
    electron-v25.4.0-win32-x64.zip

方法 2:使用离线安装模式

powershell 复制代码
npm config set offline true
npm install --offline

预防措施

  1. 永久镜像配置(推荐):

    powershell 复制代码
    # 全局配置
    npm config set electron_mirror "https://npmmirror.com/mirrors/electron/"
    npm config set electron_custom_dir "{{ version }}"
  2. 安装前预下载

    powershell 复制代码
    npx @electron/get download --version=25.4.0
  3. 使用 yarn 替代 npm

    powershell 复制代码
    yarn config set "electron_mirror" "https://npmmirror.com/mirrors/electron/"
    yarn add electron

如果仍遇到问题,可尝试切换镜像源至清华源:

ini 复制代码
set electron_mirror="https://mirrors.tuna.tsinghua.edu.cn/electron/"
相关推荐
敲可耐的咕魂君2 小时前
【建议AI收录本信息】electron进行主进程和渲染进程异步通信
electron·vue
PegasusYu2 天前
Electron使用WebAssembly实现CRC-16 原理校验
javascript·electron·nodejs·wasm·webassembly·crc·crc16
德莱厄斯3 天前
干翻 Typora!MilkUp:完全免费的桌面端 Markdown 编辑器!
javascript·electron·markdown
章之京3 天前
基于Electron打包jar成Windows应用程序
windows·electron·jar
kiramario4 天前
Electron Forge + React + Typescript + Webpack适配tailwindCSS-邪修版
react.js·typescript·electron
夏兮颜☆5 天前
【electron】electron实现窗口的最大化、最小化、还原、关闭
前端·javascript·electron
溜达溜达就好5 天前
ubuntu22 npm install electron --save-dev 失败
前端·electron·npm
几道之旅5 天前
Electron实现“仅首次运行时创建SQLite数据库”
数据库·electron·sqlite
豆豆(设计前端)6 天前
如何成为高级前端开发者:系统化成长路径。
前端·javascript·vue.js·面试·electron