,用开发web的方式进行开发,跨平台兼容 1环境搭建 1.1 先全局安装脚手架 (如已经安装,可以跳过) npm install -g electron npm install -g electron-forge (安装electron-forge模板) 1.2 用模板 创建项目 electron-forge init notepad(项目名) 1.3 安装依赖 (安装依赖时建议使用cnpm淘宝镜像 npm会有访问外国网站被卡) cd notepad npm install 1.4 运行 electron-forge start或 npm start 2.打包exe
start", "package": "electron-forge package", "make": "electron-forge make" }, "dependencies /cli": "^6.4.2", "@electron-forge/maker-deb": "^6.4.2", "@electron-forge/maker-rpm": "^6.4.2" , "@electron-forge/maker-squirrel": "^6.4.2", "@electron-forge/maker-zip": "^6.4.2", "@electron-forge import 生成electron-forge的配置文件 npx electron-forge import 生成的文件名为 forge.config.js ,内容如下: module.exports name: '@electron-forge/maker-rpm', config: {}, }, ], plugins: [ { name: '@electron-forge
打包项目 Electron的打包工具有很多,例如 electron-builder、electron-packager 或 electron-forge。 electron-forge:是一个全面的 Electron 开发工具集,提供了打包、调试和发布等功能,并且易于使用。 使用 electron-forge 将 Electron Forge 添加到您应用的开发依赖中,并使用其"import"命令设置 Forge 的脚手架: npm install --save-dev @ electron-forge/cli # 如果缺少某些工具,根据提示安装完,重新执行即可 # 如果需要下载东西,安装时间可能比较长 npx electron-forge import 上面的配置完毕后, start", + "package": "electron-forge package", + "make": "electron-forge make" }, 使用 Forge 的 make
当请求到我们的接口根据请求的信息自动接口判断然后给到客户端更新说明等信息 然后让其下载并更新安装 打包发布-forge 当我们程序开发完成后我们需要对其打包发布以便于用户安装使用 引入依赖 首先我们需要引入打包依赖 这里我们使用的electron-forge import"命令设置 Forge 的脚手架 执行完成后我们可以看到package.json发生了一些变化 首先是启动脚本发生变化 而是依赖脚本 以及打包的路径 npm install --save-dev @electron-forge /cli npx electron-forge import 温馨提示 这里如果你本地电脑nodejs版本过低会报错 升级最新的nodejs稳定版即可 编译打包 使用 Forge 的 make
npm install --save-dev @electron-forge/cli npx electron-forge import ✔ Checking your system ✔ Initializing package.json file ✔ Fixing .gitignore We have ATTEMPTED to convert your app to be in a format that electron-forge Thanks for using "electron-forge"!!! 2.使用make命令创建可分发的应用 npm run make > my-electron-app@1.0.0 make /my-electron-app > electron-forge make ✔
但是我在windows上配置环境的时候npm版本不对,导致electron一直安装不成功,问题如下: 1、npm是6.14.10,就差一个小版本,结果安装electron-forge(npx @electron-forge Thanks for using "electron-forge"!!! "devDependencies": { "@electron-forge/cli": "^6.0.0-beta.54", "@electron-forge/maker-deb": "^ 6.0.0-beta.54", "@electron-forge/maker-rpm": "^6.0.0-beta.54", "@electron-forge/maker-squirrel "devDependencies": { "@electron-forge/cli": "^6.0.0-beta.54", "@electron-forge/maker-dmg": "^
全局安装Electron: cnpm install -g electron 再安装一个傻瓜化的Electron工具包: cnpm install -g electron-forge 这俩因为是全局安装 就要cd进E:electron1,再运行: git clone https://github.com.cnpmjs.org/electron/electron-quick-start 事实上,应该是 electron-forge ", "make": "electron-forge make" }, "repository": "https://github.com/electron/electron-quick-start 继续运行: cnpm run make 或者是: cnpm run-script make 再或者是: electron-forge make 事实上这三个运行的结果是一样的…… 都是调用 electron-forge
基本情况 electron版本:"electron": "^28.0.0" forge版本:"@electron-forge/cli": "^7.2.0" 出错命令:npm run make 报错信息:
但是经过我的实际测试,发现 Electron Forge ,也就是官方推荐的打包工具默认的 Fuse 配置如下 forge.config.js const { FusesPlugin } = require('@electron-forge module.exports = { packagerConfig: { asar: true, }, rebuildConfig: {}, makers: [ { name: '@electron-forge /maker-squirrel', config: {}, }, { name: '@electron-forge/maker-zip', platforms : ['darwin'], }, { name: '@electron-forge/maker-deb', config: {}, }, { name: '@electron-forge/maker-rpm', config: {}, }, ], plugins: [ { name: '@electron-forge
https://cdn.npm.taobao.org/dist/electron/ 打包 注意:图标格式 Windows 下使用的 icon.ico Mac 使用的是 icon.icns 使用electron-forge 安装 npm install --save-dev @electron-forge/cli npx electron-forge import 使用 npm run make 打包参数配置 package.json
三、electron-forge 方式(打包) 这种方式不光可以运行,还可以打包。 3.1、安装依赖包 npm install --save-dev @electron-forge/cli --save-dev 是 npm 的一个命令行选项,用于将指定的包作为开发依赖项安装到项目中。 (内容由讯飞星火 AI 生成) 3.2、将项目导入到 Electron Forge npx electron-forge import npx electron-forge import 是一个用于将项目导入到 npx electron-forge init,这将生成一个基本的 Electron 应用程序结构。 3、接下来,使用 npx electron-forge import 命令将项目导入到 Electron Forge。
path.join(__dirname, 'preload.js') } }) 复制代码 打包分发(Electron Forge) 安装并添加命令: npm install --save-dev @electron-forge /cli npx electron-forge import 执行make命令创建应用程序: npm run make 打包结束后会在项目根目录下生成out文件及打包内容 总结: 内容主要整理自官方指南
发布新应用的最快方式是使用Electron Forge (1)添加Electron Forge作为你应用的开发依赖,并使用它的import命令来设置Forge的脚手架: npm install --save-dev @electron-forge /cli npx electron-forge import (2)使用 Forge 的package命令打包发布成exe文件: npm run package out目录下面存放的是打包好的exe
首先对其进行安装和配置: npm install --save-dev @electron-forge/cli npx electron-forge import 完成上述命令之后,项目目录下的
再次踩在前人的肩膀上选择了 Electron-forge 这个工具。 一个小时才搞定了最简单的打包,发布在了Github。
4.2构建工具选型我们选择的是 Electron-Forge。理由很充分:Electron-Forge简单而又强大,目前 electron 应用最好的构建工具之一。 这里提一下 electron-builder 其和 electron-forge 的介绍和区别。 看下图所示:两者最大的区别在于自由度,两者在能力上基本没什么差异了,从官方组织中的排序看,有意优先推荐 electron-forge 。 5.2二进制文件构建本章节内容是基于 electron-forge 阐述的,不过原理是一样的。在开发桌面端应用时,会有场景要用到第三方的二进制程序,比如 ffmpeg 这种。
public等类型即文档类型的约束,更少的单元测试的覆盖更安全的代码 针对工具更好的重构能力静态分析自动导包代码错误检查代码跳转代码提示补齐 社区 大量的社区的类型定义文件 提升开发效率2.2 构建工具 Electron-Forge 这里提一下 electron-builder 其和 electron-forge 的介绍和区别,看下图所示:两者最大的区别在于自由度,两者在能力上基本没什么差异了,从官方组织中的排序看,有意优先推荐 electron-forge https://tool.520101.com/diannao/ico/(opens new window)命令行生成: 使用 sips 和 iconutil 生成3.2 二进制文件构建本章节内容是基于 electron-forge
npm install -g cnpm --registry=https://registry.npm.taobao.org 安装Electron cnpm install -g electron 安装Electron-forge cnpm install -g electron-forge 新建项目 假设项目要放到H:\Electron目录下,项目名为notepad(字母全部小写,多个单词之间可以用“-”连接)。 electron-forge init notepad cd到notepad目录下,执行下面的命令来启动app(也可以简单的用npm start来运行)。 electron-forge start ? cmd.exe 这样就可以看到基本的app界面了。
在终端中运行以下命令: npx electron-forge init my-app 这将创建一个名为my-app的Electron应用程序,并生成一些默认文件和目录。 3.
该工具其实也支持 Windows 系统,只不过需要开发者运行 npm install electron-forge 命令自行编译。