Skip to content

Latest commit

 

History

History
56 lines (42 loc) · 1.43 KB

environment-variables.md

File metadata and controls

56 lines (42 loc) · 1.43 KB
Raw
description
Learn to add and access environment variables in your Next.js application at build time.

Environment Variables

Examples

To add environment variables to the JavaScript bundle, open next.config.js and add the env config:

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

Now you can access process.env.customKey in your code. For example:

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

export default Page

Next.js will replace process.env.customKey with 'my-value' at build time. Trying to destructure process.env variables won't work due to the nature of webpack DefinePlugin.

For example, the following line:

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

Will end up being:

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

Related