AstroのChangelog

heroimage

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ディレクトリで

Terminal window
npm run dev -- --host 0.0.0.0

2023-01-12

Gatsby 環境は残した上で

Astroはじまる

2011 年までの Changelogmemo をかなり gatsby に移動した

古い画像に関してはimg.ubanis.comからの取得とした。
そのせいでGatsby-Imageで処理されないため元の画像そのものが表示されてしまうが。