ランタイム設定

Nuxt は、アプリケーション内で設定とシークレットを公開するためのランタイム設定 API を提供します。
runtimeConfig オプションを使用する場合、nitro が設定されている必要があります。

ランタイム設定の更新

Nuxt 3 は、新しい結合された runtimeConfig オプションを使用し、Nuxt 2 とは異なる方法でランタイム設定にアプローチします。

まず、publicRuntimeConfig と privateRuntimeConfig プロパティを runtimeConfig という新しいプロパティに結合する必要があります。その際、パブリック設定は public というキー内に配置します。

// nuxt.config.js
- privateRuntimeConfig: {
-   apiKey: process.env.NUXT_API_KEY || 'super-secret-key'
- },
- publicRuntimeConfig: {
-   websiteURL: 'https://public-data.com'
- }
+ runtimeConfig: {
+   apiKey: process.env.NUXT_API_KEY || 'super-secret-key',
+   public: {
+     websiteURL: 'https://public-data.com'
+   }
+ }

これは、パブリックランタイム設定にアクセスする必要がある場合、それが public というプロパティの背後にあることを意味します。パブリックランタイム設定を使用する場合は、コードを更新する必要があります。

// MyWidget.vue
- <div>Website: {{ $config.websiteURL }}</div>
+ <div>Website: {{ $config.public.websiteURL }}</div>