Nuxt 2 또는 3 프로젝트에서 환경 변수에 액세스하는 방법은 무엇입니까?

Nuxt 2 또는 3에서 환경 변수에 액세스: .env가 쉬워졌습니다

Nuxt 2 또는 Nuxt 프로젝트에서 환경 변수를 사용하는 경우 3, 올바른 접근 방식을 이해하는 것이 중요합니다. 이 문서에서는 Nuxt 구성의 .env 파일에서 환경 변수를 읽는 방법을 살펴보겠습니다.

Nuxt 2.13 이상에서는 프레임워크가 기본적으로 지원하므로 @nuxtjs/dotenv를 사용할 필요가 없습니다. 환경 변수. 변수를 정의하려면 프로젝트 루트에 .env 파일을 생성하고 이를 키-값 쌍으로 채웁니다.

Nuxt 2.13 이상

nuxt에서 .config.js, 의도에 따라 publicRuntimeConfig 또는 privateRuntimeConfig를 사용하여 환경 변수를 정의합니다. 사용법.

export default {
  publicRuntimeConfig: {
    myPublicVariable: process.env.PUBLIC_VARIABLE,
  },
  privateRuntimeConfig: {
    myPrivateToken: process.env.PRIVATE_TOKEN,
  },
};

Nuxt 3

Nuxt 3에서는 nuxt.config.js에 RuntimeConfig 객체가 도입되었습니다. 여기에서 환경 변수를 정의하세요.

import { defineNuxtConfig } from 'nuxt3';

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

구성 요소에서 이러한 변수에 액세스하려면 Nuxt 2에서 this.$config를 사용하고 Nuxt 3에서 useRuntimeConfig()를 사용하세요.

환경 액세스 Nuxt.config의 변수

Nuxt.config의 경우 환경 변수에 직접 액세스할 수 있습니다. process.env.VARIABLE_NAME을 사용합니다.

export default {
  modules: [
    ['@nuxtjs/recaptcha', {
      siteKey: process.env.RECAPTCHA_SITE_KEY,
      version: 3,
      size: 'compact',
    }],
  ],
};

이러한 단계를 따르면 Nuxt 프로젝트에서 환경 변수를 원활하게 활용할 수 있습니다. 사용 중인 Nuxt 패키지에 따라 구문이 약간 다를 수 있습니다. 구체적인 지침은 공식 문서를 참조하세요.

위 내용은 Nuxt 2 또는 3 프로젝트에서 환경 변수에 액세스하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!