GitHub Desktopのビルド環境作成について
This site is only available in Japanese.
Windows 10(22H2)以降 64bitのみ 最低RAM 8GB以上
MacOS Gig Sur以降 最低RAM 8GB以上
Arch Linuxとその派生、Debianとその派生、Ubuntu22以降 64bitのみ 最低RAM 8GB以上
※注意 2024年1月現在、node.js(最新版)はバージョン22で、GiHub Desktop 開発環境は3.3.7 beta 2からバージョン20までが対象になり、反面バージョン18未満は非対象になった。
このため、node.jsを最低でもバージョン20にアップグレード、もしくはバージョン21のLTS版を導入している場合ダウングレードが必要となる。
一番簡単なのは、npmからnをインストールして任意のnode.jsを導入する方法。以下にコマンドを記載しておく(macとLinuxで有効)。
sudo npm install -g n
n ls-remote
sudo n 20.18.0
Windowsでは n が使えないので、公式ページからLTS版をダウンロードするか、下記ページを開き、x64 msiインストーラを選択してダウンロードして、実行
https://nodejs.org/download/release/v20.18.0/
VS Codeの拡張機能のおすすめは以下の通り
- Japanese Language Pack for Visual Studio Code
- Markdown Preview Mermaid Support
- ESLint
- Sort lines
npmからのインストールが簡単だと思う
sudo npm yarn install -g
なお、Macで
xcrun: error: invalid active developer path (/Library/Developer/CommandLineTools), missing xcrun at:
のようなエラーが出た場合、xcodeのバージョンが古いので最新にする必要がある(xcodeの新規インストールは2～3時間かかる場合もあるので注意)
xcode-select --install
debian系か Ubuntu系であれば、おそらく初めから dpkg は入っていると思うが、Arch系 Linuxの場合、Octopi や pacman を使って dpkgをインストールしておく
- Windows/Macの場合
<> Code ▼ボタンをクリックし、開いたメニューから"Open GitHub Desktop"を選択
- Linuxの場合
1. <> Code ▼ボタンをクリックし、開いたメニューから HTTPS - "https://github.com/yasuking0304/desktop.git" 右横のコピーボタンをクリック
2. GitHub Desktop を開き、 メニューから Clone Reposiory を選択し、表示されたダイアログのテキストボックスに Ctrl + V でペーストする
yarn add i8next
yarn add --dev i8next-parser
10分くらい何やらインストールを始めるので、ひたすら待つ
NPMスクリプトから、build:prodを実行する(言語だけの修正ならdevを使う必要はない)
Core i3、RAM 8M、普通の3.5インチハードディスクで 4分50秒くらい時間がかかる。
Core i5、RAM 16M、SSDでも4分20秒 かかるので、それほど環境に拘る必要はない。
とはいえ、RAM 4M ではビルドに失敗する。
NPMスクリプトから、start:prodを実行する(Macの場合、成果物を直接実行してもcliが実行されずメニューが日本語化されないので特に注意)
【現象1】
Mac でビルドすると、メニューが英語のまま
【備考】
理由はこちら
https://github.com/yasuking0304/SetEnv-Lang-MacOS
【現象2】
独自ビルドしたアプリでサインインできない問題
設定画面→ダイアログからサインインしてブラウザが開いた後、応答がない。
ダイアログ上のキャンセルボタンは機能しないがダイアログ右上の×ボタンは効く。
【手順】
メニュー ファイル → オプション → アカウント でサインアウトして再度サインインする
【備考】
具体的にはここで止まっている
app\src\lib\stores\sign-in-store.ts
public async authenticateWithBrowser(): Promise<void> {
const currentState = this.state
if (!currentState || currentState.kind !== SignInStep.Authentication) {
const stepText = currentState ? currentState.kind : 'null'
return fatalError(
`Sign in step '${stepText}' not compatible with browser authentication`
)
}
this.setState({ ...currentState, loading: true })
let account: Account
try {
log.info('[SignInStore] initializing OAuth flow')
account = await askUserToOAuth(currentState.endpoint) /// ← ここで止まる
log.info('[SignInStore] account resolved')【原因】
ベータ版でビルドしたアプリは、GitHubには「GitHub Desktop」ではなく「The GitHub Desktop Development App」として認識される。
具体的には自分のGitHubページの Settings → 左ペインの「Integrations」下にある Applications → 「Authorized OAuth Apps」タブで確認できる。
build:prodでビルドしても、 app -> package.json -> vesion にtestの文字が含まれていたり、未知のバージョンの場合、GitHubサーバーにはDevelopmentで認識される。
この場合、headerは x-github-desktop-auth ではなく x-github-desktop-dev-auth で応答しないといけない。
これは昔からGitHub Desktopをコミュニティビルドする人には避けて通れない問題なので本家のissueで説明済み。
https://github.com/desktop/desktop/issues/11410#issuecomment-1872924345
なお、コミュニティビルドでは、意図して x-github-desktop-dev-auth に改変している。
具体的には app -> src -> main-process -> main.ts の 105行目を変更している。
【現象3】
Linux上でコミュニティビルド版を使用したのち、Debianのストア版(バージョン3.2.5-linux)を使用すると設定が吹っ飛ぶ
【備考】
理由は、Electronのバージョンが22.0から上がり、LocalStorageの互換性が過去互換しか維持されておらず、新しい設定を古いバージョンでは読み込めずリセットされる。
経緯はこちら https://github.com/yasuking0304/desktop/issues/17
shiftkeyさんはこの現象に気づいていたためか、Linux Fork版はしばらくElectronのバージョンを上げていなかったが、マルチランゲージ版はWin/Mac版とほぼ同一ソースで動作させることを目的にしていたためElectronのバージョンは上げている。
対応策はない。