런타임 설정(Runtime Config)

Nuxt는 애플리케이션 내에서 설정과 시크릿을 노출하기 위한 런타임 설정 API를 제공합니다.
runtimeConfig 옵션을 사용할 때는 nitro가 반드시 설정되어 있어야 합니다.

런타임 설정 업데이트

Nuxt 3는 Nuxt 2와는 다르게 새로운 통합 runtimeConfig 옵션을 사용하여 런타임 설정을 처리합니다.

먼저, 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>