env

Next.js 9.4 릴리스부터 환경 변수를 추가할 때 더욱 직관적이고 인체공학적인 환경을 제공합니다. 한 번 사용해 보세요!

Note: 이러한 방식으로 지정된 환경 변수는 항상 자바스크립트 번들에 포함되며, 환경 변수 이름 앞에 NEXT_PUBLIC_을 붙이는 것은 환경 또는 .env 파일을 통해 지정할 때만 효과가 있습니다.

JavaScript 번들에 환경 변수를 추가하려면 next.config.js를 열고 env 설정을 추가합니다: next.config.js

module.exports = {
  env: {
    customKey: "my-value",
  },
};

이제 코드에서 process.env.customKey에 액세스할 수 있습니다. 예:

function Page() {
  return <h1>The value of customKey is: {process.env.customKey}</h1>;
}

export default Page;

Next.js는 빌드 시점에 process.env.customKey를 'my-value’으로 대체합니다. 웹팩 DefinePlugin의 특성으로 인해 process.env 변수를 파괴하려고 하면 작동하지 않습니다.

예를 들어 다음 줄이 있습니다:

return <h1>The value of customKey is: {process.env.customKey}</h1>;

다음과 같이 됩니다:

return <h1>The value of customKey is: {"my-value"}</h1>;

Provide feedback