Astroで環境変数を使用する

Astroで環境変数を使用する方法

Astro uses Vite’s built-in support for environment variables, and lets you use any of its methods to work with them.

Astroの環境変数は、viteの組み込み環境変数を使用しているようで、viteを使用したプロジェクトと同様に使用できそうです。

サーバー側コードで環境変数を使用する

基本的にはプロジェクトルートに配置された.envファイルに定義された環境変数をimport.meta.env.SAMPLE_ENV_VARという形で使用できるようです。

サーバー側で環境変数を使用する場合は特に命名のルールはなさそうです。

SAMPLE_ENV_VAR=sample-env.env

クライアント側のコードで環境変数を使用する

クライアント側では、以下のようにPUBLIC_から始まる環境変数しか利用できないようなので注意が必要です👀

PUBLIC_SAMPLE_ENV_VAR=sample-env.env

Defaultで用意されている環境変数

• import.meta.env.MODE: サイトが実行されているモード。astro dev実行時はdevelopment、astro build実行時はproductionが入るようです。
• import.meta.env.PROD:サイトがproduction環境で実行されている場合trueになる。
• import.meta.env.DEV:サイトがdev環境で実行されている場合trueになる。
• import.meta.env.BASE_URL:astro.configのbaseに設定されている値が入るようです。特に設定していなければ/になる。
• import.meta.env.SITE:astro.configのsiteに設定されている値が入るようです。特に設定していなければ値は何も入らない。
• import.meta.env.ASSETS_PREFIX:astro.configのbuild.assetsPrefixに設定されている値が入るようです。特に設定していなければ値は何も入らない。

その他の環境変数に関わるルール

環境変数を定義する.envファイルは.env.productionや.env.developmentのようにファイル名にモードを付けることもできるようです。これにより、環境変数がそのモードでのみ有効になります。

参考文献

• https://docs.astro.build/en/guides/environment-variables/#default-environment-variables
• https://vitejs.dev/guide/env-and-mode.html