AstroのChangelog
2023-01-28
全然関係ないが VSCode の Markdown 拡張の TOC 自動挿入がとんでもない便利さだということに気づいた。
Gatsby 時代と同じ構成に
同人ページのコントロール部分以外はほぼできたといえる。ブログのルーティングが Gatsby のときと同じようにインデックスになるようになった。
Astro の Collection のプロパティである slug の先頭にはちゃんと ”/” を付けないと正しい URL にならないことが分かった。
現在のページ構成
このようなページ構成になっている。
├── pages
│ ├── 404.astro
│ ├── [...page].astro
│ ├── [...slug].astro
│ ├── [tag]
│ │ └── [...page].astro
│ ├── blog.astro
│ ├── doujin.astro
│ ├── links.astro
│ ├── message.astro
│ ├── note
│ │ ├── [...page].astro
│ │ ├── [...slug].astro
│ │ ├── [tag]
│ │ │ └── [...page].astro
│ │ └── category.astro
│ ├── profile.mdx
│ └── rss.xml.ts
Cloudflare のエラー直る
Node バージョンを 16 に指定したらビルドが正常に行われるようになった
2023-01-27
Astro 2.0
正確には現在は 2.0.1
Astro がバージョン 2.0 になりかなり変更があった
タグごとのページ化も完了
Astro の記事は長いのでページを分割した。
残る問題
Markdown ファイルの画像はいつ最適化が入るようになるのだろうか
2023-01-26
Astro が 2.01 にバージョンアップ コンテンツコレクション機能追加
サブディレクトリを認識していないのでテスト続行 ブログはもとのままとする。
Cloudflare がエラーになるようになった
Astro 2.0 から cloudflare がビルドエラーを起こすようになった。node が古いんよ
2023-01-16
astro-imagetools 導入
Gatsby-image-plugin とほぼ同じように使えるが公式のものではない
astro-imagetools で生成された img タグには img のスタイルシートが適用されない
astro-imagetools は Vercel で動作失敗報告があるが Cloudflare では正常に動いている。
同人ページとリンクページ作成
リンク画像はエラーのために通常の img タグで記述
同人ページとリンクページを json から生成するようになった
cloudflare ではほとんどのバナーがタイムアウトしてしまうのでローカル保存したほうが良いかもしれない。
動作検証済み環境
- WSL2 Node 18
- Raspberry pi 4 Node 16
- Ubuntu 22.04LTS Node14
- Cloudflare Node 14
2023-01-14
.astro ファイル作成
いろんなコンポーネントに分けた
問題点
画像最適化問題
画像を最適化するプラグインが必要
ページネーション問題
ブログがトップページにページネーションを内臓して置けない
React では <table> タグ直下に <tr> タグなどをいれるとエラーになる
Astro でも同じように <tbody></tbody> で table 内要素をちゃんと囲まないといけない。
エラーにまったく気づかず時間がかかってしまった。
astro でローカルネットワークからアクセス
astro ディレクトリで
npm run dev -- --host 0.0.0.0
2023-01-12
Gatsby 環境は残した上で
Astro はじまる
2011 年までの Changelogmemo をかなり gatsby に移動した
古い画像に関しては ubanis.mydns.jp からの取得とした。
そのせいで Gatsby-Image で処理されないため元の画像そのものが表示されてしまうが。