Astro 6 にアップグレードしたら、Live Content Collections で開発体験がかなり変わった話

🙌 結論から

このブログでも使っている Astro を、v5 系から v6 系にアップグレードしてみました。

一番の目当ては、Live Content Collections が正式に安定版になったことです！

実際に触ってみると、コンテンツの取得まわりだけでなく、開発サーバーの挙動まで変わっていて、ちょっとした地殻変動を感じました(・∀・)

移行作業自体は思ったよりすんなり終わったので、Astro を使っているならまず検証環境で試してみる価値はあると思います。

Astro 6 は2026年3月にリリースされたメジャーバージョンです。

目玉は、v5.10 で実験的に入っていた Live Content Collections の安定化でした！

これまでの Content Collections は、ビルド時にコンテンツを読み込む前提でした。

Live Content Collections なら、CMS側のデータが更新されても、ビルドをやり直さずにその場で反映されるようになるんです✨

私のブログはローカルの Markdown ファイルが中心なので恩恵は限定的ですが、外部 CMS と連携しているプロジェクトではかなり効果が大きいはずです。

もうひとつ気になっていたのが、開発サーバー astro dev の再設計で、Vite の Environment API を使う形に変わったところでした(・_・;)

手順自体はシンプルで、package.json の astro のバージョンを上げて npm install するだけでした。

npm install astro@^6.0.8
npm run build

このブログでは @astrojs/mdx も v5 系に上げる必要があったので、あわせてバージョンを揃えました。

npm install @astrojs/mdx@^5.0.3

ビルド自体はエラーなく通ったんですが、一部の設定オプションが非推奨になっていたようで、警告がいくつか出ました(´･ω･`)

エラーではなく警告だったので後回しにしても一応動くには動きますが、そのうち直したほうがいいなと思っています。

正直、最初は「うちの構成には関係ないかな」と思っていました。

でも実際に触ってみると、意外と使えそうな場面がありました(^^)

たとえば記事のタグ一覧や関連記事の抽出を、ビルド時ではなくリクエスト時に取得する形へ切り替えられそうな部分があります。

検証環境で loader を Live 対応のものに差し替えただけで動いたのは、かなりびっくりしました🙌

ドキュメントを読みながら試した範囲では、既存の Content Collections の書き方とほぼ地続きでした。

「安定版になったから触ってみるか」くらいの温度感でも十分についていける印象です!

Live Content Collections の陰に隠れがちですが、組み込みのフォントAPIもさりげなく便利になっていました。

Google Fonts や Fontsource のフォントを、設定ファイルに書くだけで管理できるようになっています。

これまで <link> タグを手で書いたり、パッケージを個別に入れたりしていた部分が、設定1箇所にまとまったのはかなり快適です!

開発サーバーの再設計についても、Vite の Environment API を使うことで、本番と同じランタイムに近い形で astro dev が動くようになったとのことです。

体感としても、開発中に気づかなかった挙動が本番ビルドで急に出る、みたいな事故がやや減った気がしますね(´・∀・)

実験的機能として Rust製コンパイラの追加も予告されていて、今後のリリースにも注目したいところです👀

パパ系Webエンジニア〜愛用ガジェット一覧 🛍️

この記事を書いている作業環境のガジェットを楽天ROOMにまとめています ✨ 在宅エンジニアのデスク作りの参考にどうぞ 🙌

Astro 6 は、Live Content Collections の安定化を中心に、開発サーバーやフォント管理まで地続きで改善されたメジャーアップデートでした。

移行作業自体は package.json を書き換えて npm install するだけで、大きな破壊的変更にハマることはありませんでした。

Astro を使っているプロジェクトなら、まずは検証環境で一度アップグレードしてみるのがおすすめです🙌

※ Astro のリリース内容は今後も更新される可能性があります。最新情報は Astro公式ブログをご確認ください👀