How to Set & Use .env Environment Variables in Nuxt.js
A .env or dotenv file is a configuration file of an application. It loads environment variables from a
.env file into
process.env. In this article, I’m going to show how to set & use it in Nuxt.js.
Table of Contents
Install dotenv Package
.env files in Nuxt, we need to install
@nuxtjs/dotenv modules. Let’s do this:
npm install @nuxtjs/dotenv
Then register the dotenv module to
nuxt.config.js file like:
buildModules: [ '@nuxtjs/dotenv' ],
Set & Use Variable
Create a .env file at the root of your project directory. Then let’s create a simple variable:
Now we’re able to get the variable in our app like:
Amazing, it works! ?
In Nuxt v2.13, they introduced runtime config feature. Please try to use environment variables like new method. Have a look at their blog post.
That’s it. Thanks for reading.
Md Obydullah is a software engineer and full stack developer specialist at Laravel, Django, Vue.js, Node.js, Android, Linux Server, and Ethichal Hacking.