nuxt3で環境変数の設定

はじめに

nuxt3の環境変数の設定がnuxt2と変わったいたので記述します。

nuxt.config.tsに環境変数を記述する

export default defineNuxtConfig({
  runtimeConfig: {
    public: {
      API_KEY: process.env.API_KEY
    },
  },
});

.envに環境変数を指定する

API_KEY = 環境変数

環境変数のしよう方法

<script setup >
  const config = useRuntimeConfig();

  const { data } = await useFetch("タグ", {
    api: config.API_KEY,
  });
</script>