electron.js入门-为生产环境构建应用程序

在本章中,我们将学习如何使用可执行文件生成生产应用程序;为此,我们将使用以下软件包:
https://www.electron.build/

需要注意的是,当您有兴趣生成应用程序的可执行文件时,必须在每个Electron.js项目中安装此包,因为它不是全局安装的依赖项,如果不是本地安装的话。

让我们在上一章中生成的聊天项目中安装该软件包:

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

安装后,我们将配置以下命令:

json 复制代码
"dev:macos": "electron-builder --macos --dir",
"pro:macos": "electron-builder --macos",
"dev:win":"electron-builder --win --x64 --dir",//不带--x64就是32位的
"pro:win":"electron-builder --win --x64", //不带--x64就是32位的
"dev:linux": "electron-builder --linux --dir",
"pro:linux": "electron-builder --linux"

然后可以根据您的操作系统执行任何命令;例如:

bash 复制代码
npm run dev:win

国内会因为网络问题失败,下面是解决办法

复制代码
# 查看npmrc所在位置
npm config ls 
# C:\Users\16471\.npmrc 修改npmrc即可,写入内容如下
electron-builder-binaries_mirror=https://npmmirror.com/mirrors/electron-builder-binaries/

生产环境打包

bash 复制代码
npm run pro:win

以可分发格式打包(例如,dmg、windows安装程序、deb包)。在执行上一个命令时,我们会将项目生成为可执行文件:<project>/dist一些文件如下所示:


当执行可执行文件时,在MacOS的情况下是DMG,在Windows的情况下,它将是EXE和对于Linux,这取决于您使用的风格,我们将看到应用程序:

另一个非常重要的细节是,根据您正在执行的项目,您必须进行额外的修改,因为工作空间是不同的;尤其是与外部文件的集成,在开发应用程序时指定的目录与生产中使用的目录不一致,在整本书中,我们将看到一些示例。

相关推荐
英俊潇洒美少年1 小时前
React 最核心 3 大底层原理:Fiber + Diff + 事件系统
前端·react.js·前端框架
我命由我123451 小时前
React Router 6 - 概述、基础路由、重定向、NavLink、路由表
前端·javascript·react.js·前端框架·ecmascript·html5·js
LJianK11 小时前
java封装
java·前端·数据库
yaaakaaang1 小时前
(四)前端,如此简单!---Promise
前端·javascript
aini_lovee2 小时前
C# 实现邮件发送源码(支持附件)
开发语言·javascript·c#
GISer_Jing2 小时前
ReAct规划原理实战指南
前端·react.js·ai·aigc
SoaringHeart2 小时前
Flutter组件封装:翻转组件 NFlipCard
前端·flutter
LlNingyu2 小时前
文艺复兴,什么是XSS,常见形式(一)
前端·安全·web安全·xss
英俊潇洒美少年2 小时前
js 进程与线程的讲解
javascript
dleei3 小时前
彻底淘汰老旧 SVG 插件:unplugin-icons 与 Tailwind CSS v4 自定义图标最佳实践
前端·程序员·前端框架