Environment variables in NEXT js


How to get env variables to your app code in NEXT.js application?

It’s not a big deal, but if you set ‘NODE_ENV’ for env in next.config.js it will not work correctly.

Anytime you will have ‘production’ (default value at build time) for any environments (staging, integration, production).

Just use another name instead ‘NODE_ENV’, for example ‘ENV’.


// next.config.js



require('dotenv').config()

module.exports = {

  env: {

    ENV: process.env.NODE_ENV,

  },

}

It will be available in your app code


export default () => <div>{process.env.ENV}</div>


C3c73736 01dc 410b 810f 9ada1f8a6ba6 rectangle 400 x
Dmitry
Sokolov

Frontend Developer at JetRockets