electron环境安装

electron环境安装

(一)、安装Nodejs、cnpm和git:
1、node.js下载和安装

下载地址:https://nodejs.org/en

下载文件为:node-v20.10.0-x64.msi

Latest LTS Version: 20.10.0 (includes npm 10.2.3)

安装到 d:\nodejs\ 目录下

如果打勾自动安装附加工具,还会自动安装python和vs build tools

cmd下查看安装情况命令:

node -v

bash 复制代码
node -v
bash 复制代码
C:\Users\hsg>node -v
v20.10.0

C:\Users\hsg>npm -v
10.2.3

2、cnpm安装命令行模式

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

bash 复制代码
npm install -g cnpm -registry=https://registry.npm.taobao.org

cmd下查看安装情况命令:

bash 复制代码
cnpm -v
bash 复制代码
D:\nodejs>cnpm -v
cnpm@9.3.2 (C:\Users\hsg\AppData\Roaming\npm\node_modules\cnpm\lib\parse_argv.js)
npm@9.9.2 (C:\Users\hsg\AppData\Roaming\npm\node_modules\cnpm\node_modules\npm\index.js)
node@20.10.0 (D:\nodejs\node.exe)
npminstall@7.11.1 (C:\Users\hsg\AppData\Roaming\npm\node_modules\cnpm\node_modules\npminstall\lib\index.js)
prefix=C:\Users\hsg\AppData\Roaming\npm
win32 x64 10.0.19045
registry=https://registry.npmmirror.com

3、git安装

下载地址:
https://gitforwindows.org/

https://github.com/git-for-windows/git/releases/download/v2.43.0.windows.1/Git-2.43.0-64-bit.exe

以及下载安装TortoiseGit-2.13.0.1-64bit.msi

(二). 安装electron环境

cnpm install -g electron //电脑首先安装cnpm

或者

npm install -g electron //全局安装(有点慢)

bash 复制代码
cnpm install -g electron

cmd查看安装版本:安装完后

bash 复制代码
electron -v
bash 复制代码
`D:\nodejs>electron -v
v28.0.0     //electron的当前版本`。
bash 复制代码
附加出错修复命令:
以管理员身份打开Windows PowerShell
1)、输入 命令:set-ExecutionPolicy RemoteSigned ,回车;

2)、Set-ExecutionPolicy -Scope CurrentUser 回车
位于命令管道位置 1 的 cmdlet Set-ExecutionPolicy
请为以下参数提供值:
ExecutionPolicy: 1

(三)、vscode运行环境下载安装包

#==========================================

#start cli cammand

cnpm install --save-dev electron @electron-forge/cli

或者

npm install --save-dev electron @electron-forge/cli

或全局安装

bash 复制代码
cnpm install -g electron @electron-forge/cli

#build cli electron-builder

打exe安装包我们使用electron-builder工具包,安装命令如下。

cnpm install --save-dev electron-builder

或者

npm install --save-dev electron-builder

或全局安装

bash 复制代码
cnpm install -g electron-builder

开发运行调试

bash 复制代码
npm run start

开始打包生成exe文件

bash 复制代码
npm run build

#==========================================

注意,json文件不能带注释,复制上面的文本后记得注释去掉。

修改package.json,添加一条scripts命令和build配置。

bash 复制代码
 "scripts": {
        "start": "electron-forge start",
        "build": "electron-builder --win" // 打包命令
    },
    "devDependencies": {
        "@electron-forge/cli": "^6.2.1",
        "electron": "^25.4.0",
        "electron-builder": "^24.6.3"
    },
    "dependencies": {
        "cesium": "^1.112.0",
        "@electron-forge/cli": "^6.2.1"
    },
    // `electron-builder`配置
    "build": {
        "productName": "我的应用", // 安装应用后桌面名称
        "directories": {
            "output": "out" // 输出的文件目录
        },
        "win": {
            "icon": "./ico/logo.ico", // 安装的图标
            "target": [
                {
                    "target": "nsis",
                    "arch": [
                        "x64",
                        "ia32"
                    ]
                }
            ]
        },
        "nsis": {
            "oneClick": false,
            "allowElevation": true,
            "allowToChangeInstallationDirectory": true,
            "installerIcon": "./ico/logo.ico",
            "uninstallerIcon": "./ico/logo.ico",
            "installerHeaderIcon": "./ico/logo.ico",
            "createDesktopShortcut": true,
            "createStartMenuShortcut": true,
            "shortcutName": "我的应用"
        }
    }

#==========================================

#如果报错,可以采用node_modules目录删除,重新下载依赖包

bash 复制代码
cnpm install

#cesium安装cmd命令: //OK

bash 复制代码
cnpm install cesium --save

本blog地址:https://blog.csdn.net/hsg77

相关推荐
梦帮科技6 小时前
GRAVIS v4.0:基于Web的极速套利架构设计与实时数据流实现
前端·人工智能·rust·自动化·区块链·智能合约·数字货币
爱勇宝7 小时前
办公资料反复修改、补传、交接混乱,我做了个桌面工具来解决这件事
前端·后端·程序员
微信开发api-视频号协议7 小时前
企业微信外部群开发自动化实践过程
java·前端·微信·自动化·企业微信·ipad
甲维斯8 小时前
Fable5:20美金的顶级设计师!
前端·人工智能
kyriewen8 小时前
我同时用了 Claude Code、Cursor 和 Codex,说说三个工具的真实差距——2026 年选错工具比不用 AI 更浪费时间
前端·ai编程·claude
Jackson__8 小时前
为了拯救我的腰椎和颈椎,我做了款浏览器插件!
前端·javascript·开源
闲猫8 小时前
Python FastAPI + SQLAlchemy 入门教程:从零搭建你的第一个 Web 应用
前端·python·fastapi
林小帅9 小时前
NestJS v11 + Prisma v7 ESM 迁移配置解析
前端·javascript·后端
IT_陈寒9 小时前
React的setState竟然不是立刻生效的,害我调试半天
前端·人工智能·后端
简简单单就是我_hehe9 小时前
前端埋点日志解决方案:完整 User-Agent 解析工具实现,爬虫识别、设备品牌、操作系统、浏览器版本全解析(附完整源码)
前端·爬虫