Skip to main content

Snapcraft 指南 (Linux)

🌐 Snapcraft Guide (Linux)

本指南提供有关如何为任何 Snapcraft 环境打包你的 Electron 应用的信息,包括 Ubuntu 软件中心。

🌐 This guide provides information on how to package your Electron application for any Snapcraft environment, including the Ubuntu Software Center.

背景和要求

🌐 Background and Requirements

与更广泛的 Linux 社区一起,Canonical 旨在通过 snapcraft 项目解决常见的软件安装问题。Snaps 是一种容器化的软件包,包含所需的依赖,支持自动更新,并且可以在所有主要的 Linux 发行版上运行,无需修改系统。

🌐 Together with the broader Linux community, Canonical aims to address common software installation issues through the snapcraft project. Snaps are containerized software packages that include required dependencies, auto-update, and work on all major Linux distributions without system modification.

创建 .snap 文件有三种方法:

🌐 There are three ways to create a .snap file:

  1. 使用 Electron Forgeelectron-builder,这两个工具随 snap 默认提供支持。这是最简单的选项。
  2. 使用 electron-installer-snap,它使用 @electron/packager 的输出。
  3. 使用已经创建好的 .deb 包。

在某些情况下,你需要安装 snapcraft 工具。有关在你的特定发行版上安装 snapcraft 的说明,请参见这里

🌐 In some cases, you will need to have the snapcraft tool installed. Instructions to install snapcraft for your particular distribution are available here.

使用 electron-installer-snap

🌐 Using electron-installer-snap

该模块的工作方式类似于 electron-winstaller 及其类似模块,其功能范围仅限于构建 snap 包。你可以通过以下方式安装它:

🌐 The module works like electron-winstaller and similar modules in that its scope is limited to building snap packages. You can install it with:

npm install --save-dev electron-installer-snap

步骤 1:打包你的 Electron 应用

🌐 Step 1: Package Your Electron Application

使用 @electron/packager(或类似工具)打包应用。确保删除最终应用中不需要的 node_modules,因为任何不实际需要的模块都会增加应用的体积。

🌐 Package the application using @electron/packager (or a similar tool). Make sure to remove node_modules that you don't need in your final application, since any module you don't actually need will increase your application's size.

输出应该大致如下所示:

🌐 The output should look roughly like this:

.
└── dist
└── app-linux-x64
├── LICENSE
├── LICENSES.chromium.html
├── content_shell.pak
├── app
├── icudtl.dat
├── libgcrypt.so.11
├── libnode.so
├── locales
├── resources
├── v8_context_snapshot.bin
└── version

步骤 2:运行 electron-installer-snap

🌐 Step 2: Running electron-installer-snap

PATH 中有 snapcraft 的终端中,运行 electron-installer-snap,唯一必需的参数是 --src,它是你在第一步创建的打包好的 Electron 应用的位置。

🌐 From a terminal that has snapcraft in its PATH, run electron-installer-snap with the only required parameter --src, which is the location of your packaged Electron application created in the first step.

npx electron-installer-snap --src=out/myappname-linux-x64

如果你有现有的构建管道,你可以以编程方式使用 electron-installer-snap。有关更多信息,请参阅 Snapcraft API 文档

🌐 If you have an existing build pipeline, you can use electron-installer-snap programmatically. For more information, see the Snapcraft API docs.

const snap = require('electron-installer-snap')

snap(options)
.then(snapPath => console.log(`Created snap at ${snapPath}!`))

snapcraft@electron/packager 一起使用

🌐 Using snapcraft with @electron/packager

步骤1:创建示例Snapcraft项目

🌐 Step 1: Create Sample Snapcraft Project

$ npx create-electron-app@latest my-app

步骤 2:创建示例 Snapcraft 项目

🌐 Step 2: Create Sample Snapcraft Project

在你的项目根目录下创建一个 snap 目录,并将以下内容添加到 snap/snapcraft.yaml 中:

🌐 Create a snap directory in your project root and add the following to snap/snapcraft.yaml:

name: electron-packager-hello-world
version: '0.1'
summary: Hello World Electron app
description: |
Simple Hello World Electron app as an example
base: core22
confinement: strict
grade: stable

apps:
electron-packager-hello-world:
command: my-app/my-app --no-sandbox
extensions: [gnome]
plugs:
- browser-support
- network
- network-bind
environment:
# Correct the TMPDIR path for Chromium Framework/Electron to ensure
# libappindicator has readable resources.
TMPDIR: $XDG_RUNTIME_DIR

parts:
my-app:
plugin: nil
source: .
override-build: |
npm install electron @electron/packager
npx electron-packager . --overwrite --platform=linux --output=release-build --prune=true
cp -rv ./my-app-linux-* $SNAPCRAFT_PART_INSTALL/my-app
build-snaps:
- node/14/stable
build-packages:
- unzip
stage-packages:
- libnss3
- libnspr4

如果你想将此示例应用到现有项目中,请将所有 my-app 的实例替换为你的项目名称。

🌐 If you want to apply this example to an existing project, replace all instances of my-app with your project's name.

步骤3:构建 snap

🌐 Step 3: Build the snap

$ snapcraft

<output snipped>
Snapped electron-packager-hello-world_0.1_amd64.snap

步骤4:安装snap

🌐 Step 4: Install the snap

sudo snap install electron-packager-hello-world_0.1_amd64.snap --dangerous

步骤 5:运行 snap

🌐 Step 5: Run the snap

electron-packager-hello-world

使用现有的 Debian 软件包

🌐 Using an Existing Debian Package

Snapcraft 能够将现有的 .deb 文件转换为 .snap 文件。Snap 的创建是通过一个 snapcraft.yaml 文件进行配置的,该文件描述了源文件、依赖、说明和其他核心构建模块。

🌐 Snapcraft is capable of taking an existing .deb file and turning it into a .snap file. The creation of a snap is configured using a snapcraft.yaml file that describes the sources, dependencies, description, and other core building blocks.

步骤 1:创建一个 Debian 软件包

🌐 Step 1: Create a Debian Package

如果你还没有 .deb 软件包,使用 electron-installer-snap 可能是创建 snap 软件包的更简单方式。然而,创建 Debian 软件包的多种解决方案也存在,包括 Electron Forgeelectron-builderelectron-installer-debian

🌐 If you do not already have a .deb package, using electron-installer-snap might be an easier path to create snap packages. However, multiple solutions for creating Debian packages exist, including Electron Forge, electron-builder or electron-installer-debian.

步骤 2:创建 snapcraft.yaml

🌐 Step 2: Create a snapcraft.yaml

有关可用配置选项的更多信息,请参见 关于 Snapcraft 语法的文档。让我们来看一个示例:

🌐 For more information on the available configuration options, see the documentation on the snapcraft syntax. Let's look at an example:

name: myApp
version: '2.0.0'
summary: A little description for the app.
description: |
You know what? This app is amazing! It does all the things
for you. Some say it keeps you young, maybe even happy.

grade: stable
confinement: classic

parts:
slack:
plugin: dump
source: my-deb.deb
source-type: deb
after:
- desktop-gtk3
stage-packages:
- libasound2
- libnotify4
- libnspr4
- libnss3
- libpcre3
- libpulse0
- libxss1
- libxtst6
electron-launch:
plugin: dump
source: files/
prepare: |
chmod +x bin/electron-launch

apps:
myApp:
command: bin/electron-launch $SNAP/usr/lib/myApp/myApp
desktop: usr/share/applications/myApp.desktop
# Correct the TMPDIR path for Chromium Framework/Electron to ensure
# libappindicator has readable resources.
environment:
TMPDIR: $XDG_RUNTIME_DIR

如你所见,snapcraft.yaml 指示系统启动一个名为 electron-launch 的文件。在此示例中,它将信息传递给应用的二进制文件:

🌐 As you can see, the snapcraft.yaml instructs the system to launch a file called electron-launch. In this example, it passes information on to the app's binary:

#!/bin/sh

exec "$@" --executed-from="$(pwd)" --pid=$$ > /dev/null 2>&1 &

或者,如果你使用 strict 限制来构建你的 snap,你可以使用 desktop-launch 命令:

🌐 Alternatively, if you're building your snap with strict confinement, you can use the desktop-launch command:

apps:
myApp:
# Correct the TMPDIR path for Chromium Framework/Electron to ensure
# libappindicator has readable resources.
command: env TMPDIR=$XDG_RUNTIME_DIR PATH=/usr/local/bin:${PATH} ${SNAP}/bin/desktop-launch $SNAP/myApp/desktop
desktop: usr/share/applications/desktop.desktop

可选:启用桌面捕获

🌐 Optional: Enabling desktop capture

在某些使用 Wayland 协议的 Linux 配置中,捕获桌面需要 PipeWire 库。要将 PipeWire 与你的应用打包,请确保基础 snap 设置为 core22 或更高版本。接下来,创建一个名为 pipewire 的部分,并将其添加到应用的 after 部分:

🌐 Capturing the desktop requires PipeWire library in some Linux configurations that use the Wayland protocol. To bundle PipeWire with your application, ensure that the base snap is set to core22 or newer. Next, create a part called pipewire and add it to the after section of your application:

  pipewire:
plugin: nil
build-packages: [libpipewire-0.3-dev]
stage-packages: [pipewire]
prime:
- usr/lib/*/pipewire-*
- usr/lib/*/spa-*
- usr/lib/*/libpipewire*.so*
- usr/share/pipewire

最后,为 PipeWire 配置应用的环境:

🌐 Finally, configure your application's environment for PipeWire:

    environment:
SPA_PLUGIN_DIR: $SNAP/usr/lib/$CRAFT_ARCH_TRIPLET/spa-0.2
PIPEWIRE_CONFIG_NAME: $SNAP/usr/share/pipewire/pipewire.conf
PIPEWIRE_MODULE_DIR: $SNAP/usr/lib/$CRAFT_ARCH_TRIPLET/pipewire-0.3