公開と更新
これは Electron チュートリアルの 6 章 です。
学習目標
ここまでのチュートリアルで、ついにこちらが最後のステップです! ここではアプリを GitHub の Release に公開し、アプリのコードに自動更新を組み込みます。
update.electronjs.org の利用
Electron のメンテナにより、オープンソースアプリケーションの自動更新サービスが https://update.electronjs.org にて無償で提供されています。 この必須要件は以下のとおりです。
- アプリが macOS または Windows で動作する
- アプリに GitHub の公開リポジトリがある
- ビルドが GitHub の Releases で公開されている
- ビルドが コード署名 されている
ここでは、既に全コードを GitHub の公開リポジトリにプッシュしているものとします。
別のリポジトリホスト (GitLab や Bitbucket など) をご利用の方や、コードリポジトリを非公開にする必要がある場合は、各自の Electron 更新サーバーをホストする方法についての 段階的なガイド をご参照ください。
GitHub Release を公開する
Electron Forge には Publisher プラグインがあり、パッケージ化したアプリケーションを様々なソースへと自動配信できます。 このチュートリアルでは、GitHub Publisher を利用して、コードを GitHub の Release に公開します。
個人アクセストークンを作成する
Forge は GitHub 上のどのリポジトリにも権限無しには公開できません。 Forge が GitHub の Release にアクセスできるように、認可トークンを渡す必要があります。 最も簡単な方法は、public_repo
スコープで 新しいパーソナルアクセストークン (PAT) を作成し、公開リポジトリへの書き込み権限を付与することです。 このトークンは必ず秘匿しておいてください。
GitHub Publisher のセットアップ
モジュールのインストール
Forge の GitHub Publisher はプラグインであり、プロジェクトの devDependencies
にインストールする必要があります。
- npm
- Yarn
npm install --save-dev @electron-forge/publisher-github
yarn add --dev @electron-forge/publisher-github
Forge の公開システムの設定
インストールしたら、Forge の設定でセットアップする必要があります。 オプションの完全なリストは、Forge の PublisherGitHubConfig
API ドキュメントに記載されています。
module.exports = {
publishers: [
{
name: '@electron-forge/publisher-github',
config: {
repository: {
owner: 'github-user-name',
name: 'github-repo-name'
},
prerelease: false,
draft: true
}
}
]
}
注意として、ここでは Release をドラフトとして作成するように Forge を設定しました。 これにより、実際にエンドユーザに公開することなく、生成された成果物を含むリリースを確認できます。 リリースノートを書き、頒布形式が動作することを再確認した後、手動で GitHub から Release を公開できます。
認証トークンの設定
Publisher に認証トークンを認識させる必要もあります。 デフォルトでは、環境変数 GITHUB_TOKEN
に格納されている値を使用します。
公開コマンドの実行
Forge の publish コマンドを npm スクリプトに追加します。
//...
"scripts": {
"start": "electron-forge start",
"package": "electron-forge package",
"make": "electron-forge make",
"publish": "electron-forge publish"
},
//...
このコマンドは、設定したメーカーを実行し、出力された頒布形式を新しい GitHub の Release へ公開します。
- npm
- Yarn
npm run publish
yarn run publish
デフォルトでは、ホスト OS とアーキテクチャに対応した頒布形式 1 つのみが公開されます。 Forge コマンドに --arch
フラグを渡すことで、他アーキテクチャ用にも公開できます。
このリリース名は、プロジェクトの package.json ファイルの version
フィールドに対応しています。
任意で、リリースがコードの履歴のラベル付けした時点と関連付くように、Git でリリースのタグを付ける こともできます。 npm には便利な npm version
コマンドがあり、バージョン更新やタグ付けができます。
おまけ: GitHub Actions で公開する
ローカルで公開することは苦痛です。特に、これではホストオペレーティングシステム用の頒布形式しか作成できません (つまり、macOS から Windows の .exe
ファイルを公開できません)。
これは、GitHub Actions のような自動化ワークフローでアプリを公開することで解決できます。ワークフローは、クラウド上の Ubuntu、macOS、Windows でタスクを実行できます。 これは、Electron Fiddle が採っているアプローチとまったく同じです。 詳細は Fiddle の Build と Release のパイプライン と Forge の構成 から参照できます。
アップデータコードの設置
GitHub の Release を使ったリリースシステムができたので、次は新しいリリースが出たときにアップデートをダウンロードするよう Electron アプリに指示します。 Electron アプリは autoUpdater モジュールによってこれを行い、アップデートサーバーのフィードから新バージョンがダウンロード可能であるかどうかを確認できます。
update.electronjs.org サービスは、アップデータ互換のフィードを提供します。 例えば、Electron Fiddle v0.28.0 は https://update.electronjs.org/electron/fiddle/darwin/v0.28.0 のエンドポイントをチェックし、より新しい GitHub リリースが利用可能かどうか確認します。
GitHub にリリースが公開されると、update.electronjs.org サービスがあなたのアプリケーションのために動作します。 あとは autoUpdater モジュールでフィードを設定するのみです。
このプロセスを簡単にするために、Electron チームは update-electron-app
モジュールを保守しています。これは、1 つの関数呼び出しで update.electronjs.org の autoUpdater のテンプレートをセットアップするもので、設定は不要です。 このモジュールは、プロジェクトの package.json の "repository"
フィールドと同じ update.electronjs.org のフィードを検索します。
まず、このモジュールを実行時の依存関係としてインストールします。
- npm
- Yarn
npm install update-electron-app
yarn add update-electron-app
次に、このモジュールをインポートしてメインプロセスですぐに呼び出します。
require('update-electron-app')()
これで全て完了です! パッケージされたアプリケーションは、新しい GitHub の Release が公開される毎に自身を更新します。
概要
このチュートリアルでは、Electron Forge の GitHub Publisher を設定し、アプリの頒布形式を GitHub の Release にアップロードする方法を説明しました。 プラットフォーム間では常に頒布形式を生成することはできないため、そういったマシンを利用できない場合は、継続的インテグレーションのパイプラインでビルドと公開のフローを設定することを推奨します。
Electron アプリケーションは、autoUpdater モジュールにアップデートサーバーのフィードを指定することで、自己更新が可能です。 update.electronjs.org は、GitHub の Release で公開されているオープンソースアプリケーション向けに Electron が提供する無料のアップデートサーバーです。 このサービスを利用するための Electron アプリの設定は、update-electron-app
モジュールをインストールしインポートすることで簡単に行えます。
アプリケーションが update.electronjs.org の対象でない場合は、代わりに各自のアップデートサーバーを導入し、autoUpdater モジュールを自分で構成する必要があります。
ここまでで、Electron のチュートリアルは正式に終了しました。 他のドキュメントも自由に探して、開発を楽しんでください! 質問がある方は、コミュニティの Discord サーバー をお訪ねください。