FreeBSD 中文社区 2025 第二季度问卷调查
FreeBSD 中文社区(CFC)
VitePress 镜像站QQ 群 787969044视频教程Ⅰ视频教程Ⅱ
  • FreeBSD 从入门到追忆
  • 中文期刊
  • 状态报告
  • 发行说明
  • 手册
  • 网络文章集锦
  • 笔记本支持报告
  • Port 开发者手册
  • 架构手册
  • 开发者手册
  • 中文 man 手册
  • 文章
  • 书籍
  • FreeBSD 网络文章集锦
  • 2025 年
    • zfs 速查手册
    • FreeBSD 开发计划
    • 谁在使用 FreeBSD(基金会官方版本)
    • FreeBSD 特色开发项目
    • 如何将基于 Electron 的应用程序移植到 FreeBSD
    • FreeBSD:原始操作系统发行版的火炬传承者
    • 浏览 FreeBSD 新的季度和两年一次发布计划
    • FreeBSD 日专访 BSD 守护神 Beastie
  • 2024 年 11 月
    • 苹果的开源基石:macOS 和 iOS 背后的 BSD 传统
    • 在动荡的开源世界中保持稳定:FreeBSD 的持久稳定性
    • 为什么你应该使用 FreeBSD
    • FreeBSD 13.4: 新特性及其发展历程
    • Quantum Leap Research 和 FreeBSD 基金会将投资 75 万美元以改善笔记本电脑支持和用户体验
    • 主权科技基金将投资 68.64 万欧元用于 FreeBSD 基础设施现代化
  • 2024 年 7 月
    • BSD 老将:Michael J. Karels 逝世,享年 68 岁
    • 讣告——Michael "Mike" John Karels
    • 配置自己的 VPN——基于 OpenBSD、Wireguard、IPv6 和广告拦截
    • 如何在 FreeBSD 中指定 CPU 类型
    • 使用 BIOS 引导和 UEFI 引导的 GPT 分区的区别和制作方法
    • 通过替换 ZFS 镜像池中的磁盘来扩容
    • 通过为 ZFS 池配置镜像来消除无效数据的影响
    • FreeBSD Bhyve PCI 直通
    • ZFS 池破坏实验
    • FreeBSD ports 开发技术研究
    • FreeBSD pkg 命令概述
    • portsnap 被淘汰了,本应由 git 代替,但结果我发现自己用的是 got
    • ccache 在构建 FreeBSD 的 buildworld 时的效率
    • Hyper-V FreeBSD 13 安装感想
    • 关于对 FreeBSD 发布计划和生命周期的修订
  • 2023 年 12 月
    • FreeBSD 新手?来参与社区吧
    • 介绍来 FreeBSD 的学生
    • EuroBSDCon 2023 旅行报告——Bojan Novković
    • 什么是开发播客?FreeBSD 项目的演变
    • EuroBSDCon 2023 旅行报告——Mark Johnston
    • TalkDev:探索开源的未来
    • 为什么选择 FreeBSD?Metify 展示迁移到 FreeBSD 如何对两个新产品进行增强
    • FreeBSD 基金会宣布通过 SSDF 认证
    • 2023 年全球开放大会报告
    • FreeBSD v14:恪守类 Unix 操作系统传统,提升安全性与性能
  • 2023 年 9 月
    • 认识 2023 年参与 FreeBSD 谷歌编程之夏项目的学生:Soobin Rho
    • 认识 2023 年参与 FreeBSD 谷歌编程之夏项目的学生:Aymeric Wibo
    • FreeBSD 企业工作组首次会议总结
    • OpenBSD 路由器指南
    • 认识 2023 年 FreeBSD 谷歌编程之夏的学生:Sudhanshu Mohan Kashyap
    • 认识 2023 年夏季滑铁卢大学合作学生:Naman Sood
    • FreeBSD 基金会 2023 年暑期实习生:Jake Freeland
    • 第二次企业工作组会议回顾
    • OpenBSD 与 FreeBSD:有何不同,哪个更好?
  • 2023 年 9 月以前
    • 参与宣传:2023 年 5 月的 FreeBSD 开发者峰会和 BSDCan
    • 恭喜 FreeBSD 迎来 30 周年!为什么开源项目 FreeBSD 能够持续存在
    • 庆祝 FreeBSD 成立 30 周年:许可证
    • 聚集在开放领域工作的公益和慈善基金会
    • 在 Linode 上安装 pfSense
    • 在 FreeBSD 的 jail 中安装 NextCloud
    • 将 FreeBSD 上的 Ansible 主机和客户机都安装在 Jail 中
    • FreeBSD 简介 | BSD.pw 研讨会
    • 如何在 FreeBSD 上安装 Python
    • 升级到 FreeBSD 13.2 的十大理由
    • 采访 FreeBSD 基金会执行董事 Deb Goodkin
    • 我们使用开源的 FreeBSD 作为企业操作系统的 5 个原因
    • 关于 BSD 与 Linux 的典型讨论
    • OpenBSD 太棒了
    • systemd 背后的真正动机
    • systemd 在任何地方都不安全
    • 为什么你应该将所有东西从 Linux 迁移到 BSD
    • 如何在 FreeBSD 上设置一个简单且实际工作的 WireGuard 服务器
    • 选择 FreeBSD 而非 GNU/Linux 的技术性原因
    • GPL 之殇
    • FreeBSD 与研究社区
    • 在 OpenBSD 和 FreeBSD 之间选择的区别
    • FreeBSD 是一个令人惊叹的操作系统
    • 留意日期:2023 年 11 月的自由软件组织厂商峰会
    • JENNY 日常使用的系统:FreeBSD 13.2
    • FreeBSD Ports 中的 OPTIONS 功能介绍——使用 OPTIONS_SET/OPTIONS_UNSET/NO_DIALOG 进行操作和实践
    • FreeBSD Bhyve 上的 PCI 直通
    • 2023 年 FreebBSD 谷歌编程之夏学生介绍:Raghav Sharma
    • 2023 年 7 月软件开发项目进展报道
    • 用于研究的 FreeBSD:CHERI/Morello
    • 在 FreeBSD Jail 中使用 OpenRC 启动并运行 Devuan GNU+Linux 系统
由 GitBook 提供支持
LogoLogo

FreeBSD 中文社区(CFC) 2025

在本页
  • 准备工作
  • 总结
  • 移植
  • 初始化 port
  • 放置 package.json 和锁定文件
  • 为什么需要这样做?
  • 编写 Makefile
  • 构建
在GitHub上编辑
导出为 PDF
  1. 2025 年

如何将基于 Electron 的应用程序移植到 FreeBSD

上一页FreeBSD 特色开发项目下一页FreeBSD:原始操作系统发行版的火炬传承者

最后更新于1个月前

  • 原文链接:

  • 作者:Hiroki Tagato

  • 2020 年 3 月 3 日

  • 作者复刻的 GitHub 地址:

是一款流行的框架,可用于使用 HTML、CSS 和 JavaScript 等 Web 技术开发桌面应用程序。基于 Electron 构建的应用程序有很多(无论开源还是闭源),可以在以下网站找到一些例子:

在 列表中待了一段时间后,Electron 于 2019 年 5 月正式进入 FreeBSD 的 Ports,目前支持两个主要版本(4 和 6)。自那以后,两款基于 Electron 的应用程序—— 和 (恰好都是代码编辑器)——已进入 Ports。

如果你查看这些 ports,会发现它们包含冗长的 Makefile 和大量的补丁文件。因此,你可能会认为移植基于 Electron 的应用程序是件繁琐的工作。然而,事实并非如此。这两个编辑器属于特例,移植基于 Electron 的应用程序通常比你想象的要简单。

借助一些(仍在开发中),你可以通过编写不到 100 行的 Makefile 和一些配套文件来创建一个 port。

在这篇文章中,我将介绍如何使用这些 .mk 文件来移植基于 Electron 的应用程序。我选择了一个简单但仍然实用的应用程序 作为示例。

准备工作

在开始移植之前,我们需要进行一些准备工作。首先,我们需要获取关于该应用程序的信息,例如:

  • 该应用程序所依赖的 Electron 版本,

  • 构建该应用程序所需的 Node 版本,

  • 构建该应用程序所需的 Node 包管理器。

应用程序的源代码归档文件中的 README 文档/ package.json 文件通常会提供这些信息。让我们下载该归档文件并查看内容。

fetch https://github.com/ytmdesktop/ytmdesktop/archive/v1.8.2.tar.gz
tar -xzf v1.8.2.tar.gz
less ytmdesktop-1.8.2/package.json
  • Electron 版本 —— Electron 通常被指定为应用程序项目的开发依赖项。在 package.json 文件的 devDependencies 部分,我们找到如下行:"electron": "^7.1.11",,因此所需的 Electron 版本为 7。

  • Node 版本 —— 该归档文件中没有找到关于 Node 版本的具体描述。因此,我们假设可以使用所有受支持的 Node 版本。在本例中,我们选择 12 版本。(注意:这只是因为我个人喜欢使用最新的 LTS(长期支持)版本,其他受支持的版本应该也可以正常运行。)

  • 包管理器 —— 应用程序项目通常使用一个文件来锁定所有依赖项(Node 模块)的版本,以确保项目的可复现性。如果存在 package-lock.json 文件,则表示使用的是 “NPM” 包管理器;而 yarn.lock 文件表示使用的是 “Yarn”。在本例中,该归档文件包含了这两个文件,这可能意味着可以使用任意一款包管理器。这里我们选择 NPM 作为包管理器(纯粹是个人决定 :-)。

总结

我们将使用以下版本:

  • Electron: 7

  • Node: 12

  • 包管理器: NPM

还需要进行一步准备工作。如上所述,port 将使用那些仍在开发中的 .mk 文件提供的功能。因此,我们需要获取这些文件并将它们复制到 ports 目录中。

git clone https://github.com/tagattie/FreeBSD-Electron.git
cp FreeBSD-Electron/Mk/Uses/*.mk ${PORTSDIR}/Mk/Uses

现在,我们已准备好开始创建 port。

移植

注意

初始化 port

首先,初始化 port,例如执行以下命令。(注意:这里使用了 ports-mgmt/porttools。)

cd ${PORTSDIR}
port create multimedia/ytmdesktop

放置 package.json 和锁定文件

将应用程序源代码归档文件中的 package.json 和 package-lock.json 复制到 port 的 files/packagejsons 目录中。

cd multimedia/ytmdesktop
mkdir -p files/packagejsons
cp /path/to/archive/ytmdesktop-1.8.2/package*.json files/packagejsons

为什么需要这样做?

我认为移植基于 Electron 的应用程序最麻烦的部分是准备分发文件。官方 port 需要能够使用 Poudriere 进行构建,这意味着必须预先下载所有分发文件(包括应用程序依赖的所有 Node 模块),并使用校验和文件 (distinfo) 验证其完整性。

使用 NPM 的项目会在 package.json 和 package-lock.json 中指定所有模块依赖项。辅助 .mk 文件利用这些文件来“预获取”应用程序所需的所有 Node 模块,并将它们打包成一个归档文件,以便进行校验和验证。

因此,你无需手动处理 Node 模块的分发文件。Ports 基础设施会在执行 make makesum 时自动处理这些 Node 模块的命名、获取和校验。

编写 Makefile

我们需要指定三个重要的变量:USES、USE_NODE 和 USE_ELECTRON。首先来看 USES 和 USE_NODE。通过定义这两个变量,指定的 Electron 版本、Node 版本以及包管理器会被自动添加到必要的依赖项中。

USES=           electron:7 node:12,build
USE_NODE=       npm

接下来的 USE_ELECTRON 变量涉及提供的核心功能,因此我会详细解释这些特性。

USE_ELECTRON=   prefetch extract prebuild build:builder
PREFETCH_TIMESTAMP=     1582793516
  • prefetch —— 如果在 ${DISTDIR} 目录中找不到分发文件,则在 fetch 阶段会使用预存的 package.json 和 package-lock.json 下载应用程序所依赖的所有 Node 模块。下载的 Node 模块会被打包成一个自动命名的 tar 文件,作为 DISTFILES 之一。

    • PREFETCH_TIMESTAMP —— 如果使用 prefetch 功能,则必须定义此变量。该变量是时间戳,会赋值给 tar 归档中的所有目录、文件和链接,以确保归档文件的可复现性。你可以使用命令 date '+%s' 获取一个合适的值。

  • extract —— 在 extract 阶段,将预获取的 Node 模块安装到 port 的工作源码目录中。

  • prebuild —— 在 build 阶段,会针对指定版本的 Node 重新编译本机 Node 模块,使其能够被 Node 执行,以便构建应用程序。此外,该功能还会在应用程序打包之前,针对指定版本的 Electron 重新编译本机 Node 模块。

简单来说,这三个特性将 npm install 过程拆分为三个阶段,使其适用于 port 构建流程。

当前,该特性支持 electron-builder 和 electron-packager(分别对应 build:builder 和 build:packager)。

打包工具通常被指定为开发依赖项。查看 package.json 文件的 devDependencies 部分,我们可以找到如下行:

"electron-builder": "^21.2.0"

这表明该应用程序依赖于 electron-builder。

我们已经快要完成了,但还有最后一件事要做。安装阶段的准备工作是最繁琐的部分。你需要从零开始编写安装目标,主要涉及以下几个步骤:

  • 为应用程序创建一个包装脚本;

  • 为应用程序创建 .desktop 入口文件;

  • 生成应用程序图标(除非源代码归档中已经包含了图标);

  • 在 Makefile 中编写 do-install 目标。

包装脚本的模板可能如下所示:

#! /bin/sh

export NODE_ENV=production
export ELECTRON_IS_DEV=0

electron%%ELECTRON_VER_MAJOR%% %%DATADIR%%/resources/app.asar $@

在 do-install 目标中,手动安装创建的包装脚本、.desktop 文件和图标。此外,不要忘记将打包工具生成的应用程序资源目录复制到 ${DATADIR}。

do-install:
        # 将包装脚本、.desktop 入口文件和图标安装到适当位置
        # (此处省略部分代码)
        # 安装应用程序数据目录到 ${DATADIR}
        ${MKDIR} ${STAGEDIR}${DATADIR}
        cd ${WRKSRC}/dist/linux-unpacked && \
                ${COPYTREE_SHARE} resources ${STAGEDIR}${DATADIR}

构建

最后,我们已经准备好构建这个 port 了。

make makesum # 生成 distinfo
make build

此外,我们仍然需要 pkg-descr 和 pkg-plist 文件来打包该应用程序。不过,由于这些工作与 Electron 无关,这部分就留给你自行完成了。

可在中找到完整的 port。如果你想快速查看它的样子,可以前往该链接。

现在,让我们来编写 Makefile。我只会介绍与 Electron 相关的部分。完整的 Makefile 请参考。

最后一个特性与应用程序的打包有关,它会生成可分发的应用程序形式。根据 ,常见的打包工具包括:

How to port an Electron-based application to FreeBSD
https://github.com/tagattie/FreeBSD-Electron
Electron
Electron Apps
Awesome Electron
Wanted Ports
Visual Studio Code
Atom
辅助 Makefile
YouTube Music Desktop
我复刻版 Ports 仓库
我的复刻版仓库
官方文档
electron-forge
electron-builder
electron-packager