今回、コードを見直してそれらしき箇所をみつけ修正したが、相変わらず2回pushしないと全ファイルがアップされない。原因不明。
ブツ
インストール&実行
NAME='Electron.MyLog.git.push.await.20220907103921'
git clone https://github.com/ytyaru/$NAME
cd $NAME
npm install
npm start
準備
- GitHubアカウントを作成する
repo
スコープ権限をもったアクセストークンを作成するnpm start
でアプリ起動し終了する(db/setting.json
ファイルが自動作成される)db/setting.json
に以下をセットしファイル保存するaddress
:任意のモナコイン用アドレスusername
:任意のGitHubユーザ名(デフォルト値:git config --global user.name
)email
:任意のGitHubメールアドレス(デフォルト値:git config --global user.email
)token
:repo
スコープ権限を持ったトークンrepo.name
:任意リポジトリ名(デフォルト値:ルートディレクトリ名+.Site
)- 任意で以下もセットする
repo.description
: デフォルト値:著者のつぶやきサイトです。
repo.homepage
: (空なら自動でhttps://${username}.github.io/${repo.name}/
)
dst/mytestrepo/.git
が存在しないことを確認する(あればdst
ごと削除する)- GitHub上に同名リモートリポジトリが存在しないことを確認する(あれば削除するか別名にする)
実行
npm start
で起動またはアプリでCtrl+Shift+Rキーを押す(リロードする)git init
コマンドが実行されるrepo/リポジトリ名
ディレクトリが作成され、その配下に.git
ディレクトリが作成される
- [createRepo][]実行後、リモートリポジトリが作成される
GitHub Pages デプロイ
アップロードされたファイルからサイトを作成する。
- アップロードしたユーザのリポジトリページにアクセスする(
https://github.com/ユーザ名/リポジトリ名
) - 設定ページにアクセスする(
https://github.com/ユーザ名/リポジトリ名/settings
) Pages
ページにアクセスする(https://github.com/ユーザ名/リポジトリ名/settings/pages
)Source
のコンボボックスがDeploy from a branch
になっていることを確認するBranch
をmaster
にし、ディレクトリを/(root)
にし、Saveボタンを押す- F5キーでリロードし、そのページに
https://ytyaru.github.io/リポジトリ名/
のリンクが表示されるまでくりかえす(数分かかる) https://ytyaru.github.io/リポジトリ名/
のリンクを参照する(デプロイ完了してないと404エラー)
結果
経緯
Node.jsのAPIを介してgit
コマンドを叩いたり、simple-gitパッケージを介して叩いたりした。けれど結局どちらも2回git push
しないと全ファイルがアップされないという謎の症状にみまわれた。
原因を考察する
端末でgitコマンドを叩くときはふつうに一発でアップされる。2回push
しないとアップされない症状など経験したことがない。よってgit
コマンドの問題ではないはず。
なら、またしてもElectronやNode.js絡みの謎エラーなのか? 仮にそうだとして、一体何がどうなったら中途半端にアップされることになるのだろう。コマンドを間違えたらそもそも動作しないはずだし。想像できない。
となると、私の書いたコードが間違っているはず。ありえるとしたら最初に疑ったasync
/await
。ファイルのコピーが完了する前にpush
されちゃった、とか。そういう話なら理解できる。もう一度コードを見直してみよう。
await
まわりのコード
renderer.js
window.addEventListener('DOMContentLoaded', async(event) => {
....
await maker.make()
await git.push('新規作成')
await git.push('なぜか初回pushではasset/ディレクトリなどがアップロードされないので2回やってみる')
....
})
maker.make()
でサイトに必要なファイル一式を作成している。それをawait
で完了するまで待機してからgit push
している。なので、完了前にpush
されて一部アップされない、といったことは起こらないはず。
なのに実際には起きちゃってる。もっと深くコードを追ってみよう。
site-maker.js
ファイル一式を作成するコード。
async make() { // 初回にリモートリポジトリを作成するとき一緒に作成する
await Promise.all([
this.#cp(`css/`),
this.#cp(`asset/`),
this.#cp(`db/mylog.db`),
window.myApi.cp(`LICENSE.txt`, `dst/${this.setting.github.repo.name}/LICENSE.txt`, {'recursive':true, 'preserveTimestamps':true}),
this.#readMeCode(),
this.#indexCode(),
window.myApi.cp(`src/js/app/github/export/style.css`, `dst/${this.setting.github.repo.name}/css/style.css`, {'recursive':true, 'preserveTimestamps':true}),
window.myApi.cp(`src/js/app/github/export/main.js`, `dst/${this.setting.github.repo.name}/js/main.js`, {'recursive':true, 'preserveTimestamps':true}),
window.myApi.cp(`src/lib/sql.js/1.7.0/sql-wasm.min.js`, `dst/${this.setting.github.repo.name}/lib/sql.js/1.7.0/sql-wasm.min.js`, {'recursive':true, 'preserveTimestamps':true}),
window.myApi.cp(`src/lib/sql.js/1.7.0/sql-wasm.wasm`, `dst/${this.setting.github.repo.name}/lib/sql.js/1.7.0/sql-wasm.wasm`, {'recursive':true, 'preserveTimestamps':true}),
window.myApi.cp(`src/lib/toastify/1.11.2/min.css`, `dst/${this.setting.github.repo.name}/lib/toastify/1.11.2/min.css`, {'recursive':true, 'preserveTimestamps':true}),
window.myApi.cp(`src/lib/toastify/1.11.2/min.js`, `dst/${this.setting.github.repo.name}/lib/toastify/1.11.2/min.js`, {'recursive':true, 'preserveTimestamps':true}),
window.myApi.cp(`src/js/app/github/export/sqlite-db-loader.js`, `dst/${this.setting.github.repo.name}/lib/mylog/sqlite-db-loader.js`, {'recursive':true, 'preserveTimestamps':true}),
window.myApi.cp(`src/js/app/github/export/db-to-html.js`, `dst/${this.setting.github.repo.name}/lib/mylog/db-to-html.js`, {'recursive':true, 'preserveTimestamps':true}),
window.myApi.cp(`src/js/app/github/export/run_server.py`, `dst/${this.setting.github.repo.name}/run_server.py`, {'recursive':true, 'preserveTimestamps':true}),
window.myApi.cp(`src/js/app/github/export/server.sh`, `dst/${this.setting.github.repo.name}/server.sh`, {'recursive':true, 'preserveTimestamps':true}),
window.myApi.cp(`src/js/app/github/export/.gitignore`, `dst/${this.setting.github.repo.name}/.gitignore`, {'recursive':true, 'preserveTimestamps':true}),
this.#mpurseSendButtonCode(),
window.myApi.cp(`src/lib/party/party.min.js`, `dst/${this.setting.github.repo.name}/lib/party/party.min.js`, {'recursive':true, 'preserveTimestamps':true}),
window.myApi.cp(`src/js/util/party-sparkle-hart.js`, `dst/${this.setting.github.repo.name}/lib/monacoin/party-sparkle-image.js`, {'recursive':true, 'preserveTimestamps':true}),
window.myApi.cp(`src/js/util/party-sparkle-image.js`, `dst/${this.setting.github.repo.name}/lib/monacoin/party-sparkle-hart.js`, {'recursive':true, 'preserveTimestamps':true}),
])
以下でawait
していない箇所があった。もしや、このせいか?
async #cp(path) {
...
window.myApi.cp(src, dst, {'recursive':true, 'preserveTimestamps':true})
}
async #mpurseSendButtonCode() { // デフォルトのアドレスを指定値に変更したファイルを作成・上書きする
...
window.myApi.writeFile(`${dstDir}/${file}`, code)
}
async #readMeCode() {
...
window.myApi.writeFile(`${dstDir}/${file}`, code)
}
async #indexCode() { // GitHubリポジトリ名をURLにぶちこむ
...
window.myApi.writeFile(`${dstDir}/${file}`, code)
}
async #sqliteDbLoaderCode() {
...
window.myApi.writeFile(`${dstDir}/${file}`, code)
}
コードのコメントアウトをみると以前はawait
していたけど削除したようだ。
たぶん私の勘違いだろう。Promise.all
の引数に渡すときawait
してはならず、Promise
を渡さねばならない。それをなにか勘違いして、間違った箇所でawait
を削除してしまったのだろう。
以下のようにawait
を付与するようコードを修正した。
async #cp(path) {
...
await window.myApi.cp(src, dst, {'recursive':true, 'preserveTimestamps':true})
}
async #mpurseSendButtonCode() { // デフォルトのアドレスを指定値に変更したファイルを作成・上書きする
...
await window.myApi.writeFile(`${dstDir}/${file}`, code)
}
async #readMeCode() {
...
await window.myApi.writeFile(`${dstDir}/${file}`, code)
}
async #indexCode() { // GitHubリポジトリ名をURLにぶちこむ
...
await window.myApi.writeFile(`${dstDir}/${file}`, code)
}
async #sqliteDbLoaderCode() {
...
await window.myApi.writeFile(`${dstDir}/${file}`, code)
}
これでawait Promise.all([...])
の引数部分で上記メソッドを呼び出すときawait
しなければPromise
が返るはず。それら複数のPromise
をall
の引数として渡してやれば、すべて完了するまで待機するようになるはず。
これでよし。実際にアップロードしてみた。が、結局、変わらなかった……。
git.js
git.push()
の中身もちゃんとawait
してある。
async push(message=null) {
if (!message) { message = `追記:${new Date().toISOString()}` }
let res = await this.#setUser()
res = await this.#add()
res = await this.#commit(message)
res = await this.#push()
}
async #setUser(level='local') { // local, global, system
if (!['local', 'global', 'system'].includes(level)) { alert(`db/setting.jsonファイルにGitHubユーザ名をセットしてください`, true); return false; }
const res1 = await window.myApi.shell(`cd "${this.dir}/${this.setting.github.repo.name}/"; git config --${level} user.name '${this.setting.github.username}';`)
const res2 = await window.myApi.shell(`cd "${this.dir}/${this.setting.github.repo.name}/"; git config --${level} user.email '${this.setting.github.email}';`)
return res1.stdout + '\n' + res2.stdout
}
async #add() {
return await window.myApi.shell(`cd "${this.dir}/${this.setting.github.repo.name}"; git add .;`)
}
async #addList() {
return await window.myApi.shell(`cd "${this.dir}/${this.setting.github.repo.name}"; git add -n .;`)
}
async #commit(message) {
return await window.myApi.shell(`cd "${this.dir}/${this.setting.github.repo.name}"; git commit -m '${message}';`)
}
async #remoteAddOrigin() {
return await window.myApi.shell(`cd "${this.dir}/${this.setting.github.repo.name}"; git remote add ${this.remote} "https://${this.setting.github.username}:${this.setting.github.token}@github.com/${this.setting.github.username}/${this.setting.github.repo.name}.git";`)
}
async #remoteSetUrlOrigin() {
return await window.myApi.shell(`cd "${this.dir}/${this.setting.github.repo.name}"; git remote set-url ${this.remote} "https://${this.setting.github.username}:${this.setting.github.token}@github.com/${this.setting.github.username}/${this.setting.github.repo.name}.git";`)
}
async #push() {
return await window.myApi.shell(`cd "${this.dir}/${this.setting.github.repo.name}"; git push ${this.remote} ${this.branch}`)
}
}
add
やcommit
が完了する前にpush
されちゃった、ということも起こらないはず。それぞれのコマンドでちゃんとawait
しているから。
ファイル作成とgit
コマンドは、ちゃんとawait
している。ならもうawait
は関係ないはず。一体なにが原因なんだ?
ログ
リポジトリ作成するとき2回push
するよう実装している。
await git.push('新規作成')
await git.push('なぜか初回pushではasset/ディレクトリなどがアップロードされないので2回やってみる')
このときcommit
も行う。そのときのログと思しきものが以下。
ログに出たファイル名を眺めていて思ったが、もしかしてindex.htmlでリンクされていない画像ファイルを除外しているのかな? git
コマンドにそんな余計なお節介する機能があるなんて聞いたことないけど。
1回目pushログ
[master (root-commit) 75e96dc] 新規作成
21 files changed, 863 insertions(+)
create mode 100644 .gitignore
create mode 100644 LICENSE.txt
create mode 100644 README.md
create mode 100644 asset/image/avator.png
create mode 100644 asset/image/eye-catch.png
create mode 100644 css/style.css
create mode 100644 db/mylog.db
create mode 100644 index.html
create mode 100644 js/main.js
create mode 100644 lib/monacoin/mpurse-send-button.js
create mode 100644 lib/monacoin/party-sparkle-hart.js
create mode 100644 lib/monacoin/party-sparkle-image.js
create mode 100644 lib/mylog/db-to-html.js
create mode 100644 lib/mylog/sqlite-db-loader.js
create mode 100644 lib/party/party.min.js
create mode 100644 lib/sql.js/1.7.0/sql-wasm.min.js
create mode 100644 lib/sql.js/1.7.0/sql-wasm.wasm
create mode 100644 lib/toastify/1.11.2/min.css
create mode 100644 lib/toastify/1.11.2/min.js
create mode 100644 run_server.py
create mode 100755 server.sh
じつは初回コミットだけは21ファイルしかコミットできない、とかいう制約があったりするのか? もしくはファイルサイズ上限? そんなの聞いたことがない。
2回目pushログ
頭の悪そうなコミットメッセージよ……。
[master c84041e] なぜか初回pushではasset/ディレクトリなどがアップロードされないので2回やってみる
63 files changed, 470 insertions(+)
create mode 100644 asset/image/github.svg
create mode 100644 asset/image/mastodon_mascot.svg
create mode 100644 asset/image/misskey.png
create mode 100644 asset/image/monacoin/png/256/coin-mark-black.png
create mode 100644 asset/image/monacoin/png/256/coin-mark.png
create mode 100644 asset/image/monacoin/png/256/coin-mini-monar-mouth-red.png
create mode 100644 asset/image/monacoin/png/256/coin-mini-monar.png
create mode 100644 asset/image/monacoin/png/256/coin-monar-mouth-red.png
create mode 100644 asset/image/monacoin/png/256/coin-monar.png
create mode 100644 asset/image/monacoin/png/256/mark-outline.png
create mode 100644 asset/image/monacoin/png/256/mark.png
create mode 100644 asset/image/monacoin/png/256/monar-mark-white.png
create mode 100644 asset/image/monacoin/png/256/monar-mark.png
create mode 100644 asset/image/monacoin/png/256/monar-mouth-red.png
create mode 100644 asset/image/monacoin/png/256/monar-no-face.png
create mode 100644 asset/image/monacoin/png/256/monar-transparent.png
create mode 100644 asset/image/monacoin/png/256/monar.png
create mode 100644 asset/image/monacoin/png/64/coin-mark-black.png
create mode 100644 asset/image/monacoin/png/64/coin-mark.png
create mode 100644 asset/image/monacoin/png/64/coin-mini-monar-mouth-red.png
create mode 100644 asset/image/monacoin/png/64/coin-mini-monar.png
create mode 100644 asset/image/monacoin/png/64/coin-monar-mouth-red.png
create mode 100644 asset/image/monacoin/png/64/coin-monar.png
create mode 100644 asset/image/monacoin/png/64/mark-outline.png
create mode 100644 asset/image/monacoin/png/64/mark.png
create mode 100644 asset/image/monacoin/png/64/monar-mark-white.png
create mode 100644 asset/image/monacoin/png/64/monar-mark.png
create mode 100644 asset/image/monacoin/png/64/monar-mouth-red.png
create mode 100644 asset/image/monacoin/png/64/monar-no-face.png
create mode 100644 asset/image/monacoin/png/64/monar-transparent.png
create mode 100644 asset/image/monacoin/png/64/monar.png
create mode 100644 asset/image/monacoin/svg/coin-mark-black.svg
create mode 100644 asset/image/monacoin/svg/coin-mark.svg
create mode 100644 asset/image/monacoin/svg/coin-mini-monar-mouth-red.svg
create mode 100644 asset/image/monacoin/svg/coin-mini-monar.svg
create mode 100644 asset/image/monacoin/svg/coin-monar-mouth-red.svg
create mode 100644 asset/image/monacoin/svg/coin-monar.svg
create mode 100644 asset/image/monacoin/svg/mark-outline.svg
create mode 100644 asset/image/monacoin/svg/mark.svg
create mode 100644 asset/image/monacoin/svg/monar-mark-white.svg
create mode 100644 asset/image/monacoin/svg/monar-mark.svg
create mode 100644 asset/image/monacoin/svg/monar-mouth-red.svg
create mode 100644 asset/image/monacoin/svg/monar-no-face.svg
create mode 100644 asset/image/monacoin/svg/monar-transparent.svg
create mode 100644 asset/image/monacoin/svg/monar.svg
create mode 100644 asset/image/user/kkrn_icon_user_1.svg
create mode 100644 asset/image/user/kkrn_icon_user_10.svg
create mode 100644 asset/image/user/kkrn_icon_user_11.svg
create mode 100644 asset/image/user/kkrn_icon_user_12.svg
create mode 100644 asset/image/user/kkrn_icon_user_13.svg
create mode 100644 asset/image/user/kkrn_icon_user_14.svg
create mode 100644 asset/image/user/kkrn_icon_user_2.svg
create mode 100644 asset/image/user/kkrn_icon_user_3.svg
create mode 100644 asset/image/user/kkrn_icon_user_3_my.svg
create mode 100644 asset/image/user/kkrn_icon_user_3_resize.svg
create mode 100644 asset/image/user/kkrn_icon_user_3_resize_min.svg
create mode 100644 asset/image/user/kkrn_icon_user_4.svg
create mode 100644 asset/image/user/kkrn_icon_user_5.svg
create mode 100644 asset/image/user/kkrn_icon_user_6.svg
create mode 100644 asset/image/user/kkrn_icon_user_7.svg
create mode 100644 asset/image/user/kkrn_icon_user_8.svg
create mode 100644 asset/image/user/kkrn_icon_user_9.svg
create mode 100644 asset/image/user/url.md
なぜこのファイルたちは1回目のpush
でアップされないの? 謎。
この中にある.../png/64/coin-monar.png
ファイルは、投げモナボタンの表示に使う画像なのに。
ついでにバグ修正
setting.js
末尾に改行コードが付与してしまうバグを発見したので修正した。shell
コマンド実行結果の標準出力stdout
だと末尾に改行コードが付与されたままらしい。なのでtrim()
した。
const username = await window.myApi.shell(`git config --global user.name`)
const email = await window.myApi.shell(`git config --global user.email`)
username:username.stdout.trim(),email:email.stdout.trim()
所感
結局、2回git push
しないと全ファイルがアップされない問題の原因はわからないまま。orz