simple-gitパッケージをやめてコマンド直打ちで実装し直した。それでもgit pushを2回すればアップできた。なぜ2回必要なのかは謎。

ブツ

インストール＆実行

NAME='Electron.MyLog.git.push.20220903094945'
git clone https://github.com/ytyaru/$NAME
cd $NAME
npm install
npm start

準備

  1. GitHubアカウントを作成する
  2. repoスコープ権限をもったアクセストークンを作成する
  3. インストール＆実行してアプリ終了する
    1. db/setting.jsonファイルが自動作成される
  4. db/setting.jsonに以下をセットしファイル保存する
    1. username:任意のGitHubユーザ名
    2. email:任意のGitHubメールアドレス
    3. token:repoスコープ権限を持ったトークン
    4. repo:任意リポジトリ名（mytestrepo等）
    5. address:任意モナコイン用アドレス（MEHCqJbgiNERCH3bRAtNSSD9uxPViEX1nu等）
  5. dst/mytestrepo/.gitが存在しないことを確認する（あればdstごと削除する）
  6. GitHub上に同名リモートリポジトリが存在しないことを確認する（あれば削除する）

実行

  1. npm startで起動またはアプリでCtrl+Shift+Rキーを押す（リロードする）
  2. git initコマンドが実行される
    • repo/リポジトリ名ディレクトリが作成され、その配下に.gitディレクトリが作成される
  3. [createRepo][]実行後、リモートリポジトリが作成される

GitHub Pages デプロイ

アップロードされたファイルからサイトを作成する。

  1. アップロードしたユーザのリポジトリページにアクセスする（https://github.com/ユーザ名/リポジトリ名）
  2. 設定ページにアクセスする（https://github.com/ユーザ名/リポジトリ名/settings）
  3. Pagesページにアクセスする（https://github.com/ユーザ名/リポジトリ名/settings/pages）
    1. SourceのコンボボックスがDeploy from a branchになっていることを確認する
    2. Branchをmasterにし、ディレクトリを/(root)にし、Saveボタンを押す
    3. F5キーでリロードし、そのページにhttps://ytyaru.github.io/リポジトリ名/のリンクが表示されるまでくりかえす（数分かかる）
    4. https://ytyaru.github.io/リポジトリ名/のリンクを参照する（デプロイ完了してないと404エラー）

すべて完了したリポジトリとそのサイトが以下。

まだ画像パスのバグを修正していないので投げモナボタンは表示されない。

経緯

リポジトリ 結果
Electron.MyLog.20220831094901 なぜかasset/ディレクトリがアップされない（ローカルにはあるのに）
Electron.simple.git.20220902105438 なぜか２回目のpushでアップされた

simple-gitパッケージを使わず、gitコマンドを叩くだけでも、同じように2回目のpushでアップされるかもしれない。そう思って今回、試してみたところ、成功した。

コード抜粋

renderer.js

const exists = await git.init(document.getElementById('github-repo').value)
if (!exists) { // .gitがないなら
    const res = await hub.createRepo({
        'name': `${setting.github.repo}`,
        'description': 'リポジトリの説明',
    }, setting)
    await maker.make()
    await git.push('新規作成')
    await git.push('なぜか初回pushではasset/ディレクトリなどがアップロードされないので２回やってみる') 
}

アプリが起動したとき、かつローカルリポジトリが存在しない場合、以下のようにして必要なファイルをアップロードする。

  1. git initして作成
  2. リモートリポジトリ作成
  3. サイト作成に必要なファイル一式を作成
  4. git pushする
  5. なぜか初回だけだと全ファイルがアップされないので２回目のgit pushも直後に行う

これで全ファイルがアップされた。2回git pushが必要な理由が謎。

とにかく、なぜか2回git pushしないとファイルのアップロードが完了しないのはわかった。

それはsimple-gitパッケージを使おうが、裸のコマンドで叩こうが同じ。ならパッケージがないほうがムダな依存関係を減らせるので助かる。というわけで、simple-gitパッケージは使わずに実装することにした。

今後もまだまだ未知で謎で原因不明なバグが山ほど出てくる予感しかしない……。

git.js

コマンド直打ちしているコードは以下。最初にわざわざ毎回cdでカレントディレクトリをセットしている以外は、ふつうにコマンドを叩いている。

class Git {
    async init(repo) {
        this.repo = repo
        const exists = await window.myApi.exists(`${this.dir}/${this.repo}/.git`)
        if(!exists) {
            await window.myApi.mkdir(`${this.dir}/${this.repo}`)
            let res = await window.myApi.shell(`cd "${this.dir}/${this.repo}/"; git init;`)
            res = await this.#remoteAddOrigin()
        } else {
            console.log(`${this.dir}/${this.repo}/.git は既存のためgit initしません。`)
        }
        return exists
    }
    async push(message='追記') {
        let res = await this.#setUser()
        res = await this.#add()
        res = await this.#commit(message)
        res = await this.#push()
    }
    async #setUser() {
        console.log('setUser():', this.username, this.email)
        const res1 = await window.myApi.shell(`git config --global user.name '${this.username}'`)
        const res2 = await window.myApi.shell(`git config --global user.email '${this.email}'`)
        return res1.stdout + '\n' + res2.stdout
    }
    async #add() {
        return await window.myApi.shell(`cd "${this.dir}/${this.repo}"; git add .;`)
    }
    async #addList() {
        return await window.myApi.shell(`cd "${this.dir}/${this.repo}"; git add -n .;`)
    }
    async #commit(message) {
        return await window.myApi.shell(`cd "${this.dir}/${this.repo}"; git commit -m '${message}';`)
    }
    async #remoteAddOrigin() {
        return await window.myApi.shell(`cd "${this.dir}/${this.repo}"; git remote add origin "https://${this.username}:${this.token}@github.com/${this.username}/${this.repo}.git";`)
    }
    async #remoteSetUrlOrigin() {
        return await window.myApi.shell(`cd "${this.dir}/${this.repo}"; git remote set-url origin "https://${this.username}:${this.token}@github.com/${this.username}/${this.repo}.git";`)
    }
    async #push() {
        return await window.myApi.shell(`cd "${this.dir}/${this.repo}"; git push origin ${this.branch}`)
    }
}