ろぼいんブログ

Astro v4.7リリース!開発ツールバーの改善やアップデートチェッカーなど

サムネイル

Astro 4.7がリリースされました。このバージョンでは、開発ツールバーAPIの大幅な改善、Astroを最新バージョンに保つためのアップデートチェッカーなどが含まれています。また、TypeScriptのプリセットで通常のJavaScriptの使用が許可されました。

Astro 4.7の主要な変更点は、次のとおりです。

  • 開発ツールバーAPIの大幅な改善:ツールバーアプリの開発を簡単にする新しいヘルパー関数とスタータープロジェクトが提供されます
  • アップデートチェッカー:開発サーバーを起動する際に自動でアップデートをチェックし、新しいバージョンがあればその更新方法を通知します
  • allowJs: trueの導入:TypeScriptのもっとも厳格なプリセットで.jsファイルの使用が許可されました
目次

開発ツールバーAPIの改善

Astro v4.7では、ツールバーアプリの構築と維持を容易にするために、APIが大きく改善されました。

広告
  • defineToolbarApp()ヘルパー:ツールバーアプリの定義を容易にする新しい関数です。Astroの設定のdefineConfig()やミドルウェアを定義するdefineMiddleware()と同じように利用できます
  • appヘルパーとserverヘルパー:これらのヘルパーを使うと、ツールバーとサーバー間のメッセージの送受信が容易になります
  • 新しいスタータープロジェクト:npm create astro@latest -- --template toolbar-appを実行することで、ツールバーアプリのテンプレートを生成できます

また、ReactやPreactなどのJSXフレームワークでアプリを構築するためのレシピが追加されており、Dev Toolbar App APIのドキュメントが更新されています。

アップデートチェッカーの導入

Astro 4.7からは、開発サーバーを実行する際にAstroが自動でアップデートを確認するようになりました。新しいバージョンが利用可能な場合は、ターミナルと開発者ツールバーに更新方法についてのメッセージが表示されます。

Astroの新しいバージョンが利用可能なことを示すメッセージのスクリーンショット
Astroの新しいバージョンが利用可能なことを示すメッセージ
画像:「Astro 4.7 | Astro」より

Astroは10日に1回の頻度でアップデートをチェックします。また、プロジェクトで最新より2つ以上前のバージョンのAstroを利用している場合にのみ通知を表示します。これにより、アップデート通知が過度に表示されることを防ぎます。

アップデートチェック機能を無効にするには、ASTRO_DISABLE_UPDATE_CHECK環境変数をfalseに設定するか、次のコマンドを実行します。

Terminal window
npx astro preferences disable checkUpdates

TypeScriptプリセットの変更

AstroのstrictestTypeScriptプリセットが更新されました。以前は.jsファイルが禁止されていましたが、設定がallowJs: trueに変更されたことで、プロジェクト内で.jsファイルを使用できるようになります。この機能はとくに、既存のJavaScriptのコードベースをもつプロジェクトにおいて便利です。

Windows Terminalで[npm create astro@latest]を実行した画面のスクリーンショット
Astroのプリセット選択画面で[Strictest]を選択したようす

もしstrictestプリセットを使用していて、従来のようにJavaScriptファイルの使用を禁止したい場合は、プロジェクトのtsconfig.jsonallowJs: falseを設定する必要があります。

広告

```diff lang=json
{
"compilerOptions": {

  • "allowJs": true,
  • "allowJs": false,
    }
    }
    ```

Astroのアップグレード方法

既存のプロジェクトをAstro v4.7にアップグレードするには、@astrojs/upgradeを使用できます。または、パッケージマネージャーのアップグレードコマンドを実行して手動でアップグレードできます。

Terminal window
npx @astrojs/upgrade
Terminal window
npm install astro@latest
pnpm upgrade astro --latest
yarn upgrade astro --latest

まとめ

具体的なバグ修正の詳細や、その他のアップデートは、AstroのGitHubリポジトリーのリリースノートから確認できます。

Astro 4.7では、開発者がより簡単にツールバーアプリを構築できるようになり、アップデートのチェックも自動化されました。また、TypeScriptのプリセットが変更され、JavaScriptファイルの使用が許可されるようになりました。

Astroの最新バージョンを使用することで、より柔軟で安全なWebサイトを構築できるようになります。Astroの公式ドキュメントを参照して、新しい機能を活用してみてください。

広告

参考

記事をシェア

Xに共有するBlueskyに共有するMisskeyに共有するLINEに共有するThreadsに共有する

フォローして最新情報を入手

Googleの優先ソースに追加すると、このサイトの記事をGoogleで見つけやすくなります。また、ぜひXやRSSフィードもフォローしてください。

Googleの優先ソースとして追加するGoogleの優先ソースとして追加するXのロゴ
広告
著者のアイコン画像

生まれた時から、母国語よりも先にJavaScriptを使っていました。ネットの海のどこにもいなくてどこにでもいます。

Webフロントエンドプログラマーとして、TypeScriptを用いたWebアプリやブラウザー拡張機能を制作。Xのシャドウバン検知ツール「Shadowban Scanner」やリンクカード復活ツール「Restore Link Card」を公開し、国内外のメディアで紹介されました。iGEM 2023ではJapan-UnitedチームのWikiを制作してGrand Prizeの獲得に貢献。ブログではXやSNSの最新ニュース、不具合の検証と対処法、フロントエンド開発の知見を発信しています。