Logo

dev-resources.site

for different kinds of informations.

Load Environment Variables using dotenv-local

Published at
1/8/2025
Categories
dotenv
node
vite
development
Author
yracnet
Categories
4 categories in total
dotenv
open
node
open
vite
open
development
open
Author
7 person written this
yracnet
open
Load Environment Variables using dotenv-local

How to Use dotenv-local to Load Environment Variables for Applications and Environments

dotenv-local is a utility library designed to load environment variables with a specific priority order, ideal for managing configurations across different environments like development, production, or testing. In this tutorial, we will show you how to use dotenv-local to load environment variables for different applications and environments.

Installation

To get started, install the library via npm or yarn:

npm install dotenv-local
# or
yarn add dotenv-local
Enter fullscreen mode Exit fullscreen mode

Usage

For a detailed explanation of the available options, refer to the official repository documentation.

Import the Library

Import loadEnv from dotenv-local:

import { loadEnv } from "dotenv-local";
Enter fullscreen mode Exit fullscreen mode

Example for MongoDB Variables

Let's say you have multiple .env files:

  • .env: Contains generic environment variables.
  • .env.local: Contains local development overrides.
  • .env.production: Contains production-specific variables.
  • .env.production.local: Contains production overrides.

Using dotenv-local, you can ensure that environment variables related to MongoDB are loaded correctly, with the proper overrides depending on your environment.

Basic Usage

Here is a simple example to load all environment variables, without specific prefixes or options:

import { loadEnv } from "dotenv-local";
const envVariables = loadEnv();
console.log(envVariables);
Enter fullscreen mode Exit fullscreen mode

This will load all the environment variables available in the .env files.

Custom Options for MongoDB

Now, letโ€™s load only MongoDB-related environment variables, with custom options:

import { loadEnv } from "dotenv-local";

const { MONGO_URI, MONGO_PASSWORD } = loadEnv({
  envPrefix: "MONGO_",
  envInitial: {
    MONGO_URI: "mongodb://localhost:27017",
    MONGO_PASSWORD: "mongodb://localhost:27017",
  },
  removeEnvPrefix: false,
});
console.log({ MONGO_URI, MONGO_PASSWORD });
Enter fullscreen mode Exit fullscreen mode

This will load only the environment variables that start with MONGO_, and it will not remove the prefix.

Custom Options for Express

Next, letโ€™s load only environment variables related to Express, using a different prefix:

import { loadEnv } from "dotenv-local";

const { HOST, PORT } = loadEnv({
  envPrefix: "DEPLOY_",
  envInitial: {
    DEPLOY_HOST: "127.0.0.1",
    DEPLOY_PORT: "3000",
  },
  removeEnvPrefix: true,
});
console.log({ HOST, PORT });
Enter fullscreen mode Exit fullscreen mode

This will load the variables DEPLOY_HOST and DEPLOY_PORT from your environment files, removing the DEPLOY_ prefix.

Load Multiple Variables for MongoDB and Express

Now, letโ€™s load environment variables related to both MongoDB and Express using different prefixes:

import { loadEnv } from "dotenv-local";

const { MONGO_URI, MONGO_PASSWORD, DEPLOY_HOST, DEPLOY_PORT } = loadEnv({
  envPrefix: ["DEPLOY_", "MONGO_"],
  envInitial: {
    MONGO_URI: "mongodb://localhost:27017",
    MONGO_PASSWORD: "mongodb://localhost:27017",
    DEPLOY_HOST: "127.0.0.1",
    DEPLOY_PORT: "3000",
  },
  removeEnvPrefix: false,
});
console.log({ MONGO_URI, MONGO_PASSWORD, DEPLOY_HOST, DEPLOY_PORT });
Enter fullscreen mode Exit fullscreen mode

This will load the variables DEPLOY_HOST and DEPLOY_PORT from your environment files, as well as MONGO_URI and MONGO_PASSWORD, without removing their prefixes.

Conclusion

Using dotenv-local, you can easily manage environment variables for different applications and environments (e.g., development, production). By defining custom prefixes, initial values, and the loading order, you can ensure that only the relevant variables for MongoDB, Express, or any other service are loaded, making your configuration process clean and efficient.

For more details on available options and how to configure them, check the official documentation.


License

This project is licensed under the MIT License - see the LICENSE file for details.

vite Article's
30 articles in total
Favicon
Mega Menu Breaks, CSS3
Favicon
Setup of React project with Vite and TailwindCSS
Favicon
Setting Up Dual Compilation (SSR + CSR) in ViteJS with vite-plugin-builder
Favicon
Load Environment Variables using dotenv-local
Favicon
Monorepo + microfrontend with module-federation+vite
Favicon
Help Improve Shademaker!
Favicon
Web Architecture: Monorepos, Micro-frontends, and Vite
Favicon
I Built a CaddyFile Generator Tool in Just 8 Hours โ€“ Hereโ€™s How It Went
Favicon
Unlocking the Power of Modern Web Architecture: Monorepos, Micro-Frontends, and Vite ๐Ÿš€โœจ
Favicon
Creating a react game on AWS
Favicon
Build and Deploy a Monorepo WebSocket web application with Turbo, Express, and Vite on Render Using Docker
Favicon
Vike - Next.js & Nuxt alternative for unprecedented flexibility and dependability
Favicon
๐ŸŒŸ Introducing My Open-Source Resume: A Step Toward Transparency and Contribution ๐Ÿš€
Favicon
Lovable PDF Generation
Favicon
vite
Favicon
Testing Vue components with Vitest
Favicon
How can VoidZero be commercialized?
Favicon
HMR refreshes browser with every change
Favicon
Integrating React and Vite: How It Boosted My Development Speed
Favicon
[Boost]
Favicon
Deploying React Apps with Vite: The Complete Guide
Favicon
module css dans vite
Favicon
Deploy Vite React project with React router without 404 on Github pages
Favicon
Penetration Testing Tools: A Comprehensive Guide
Favicon
Lessons Learned Migrating from React CRA & Jest to Vite & Vitest
Favicon
Static React App Deployment with Vite
Favicon
Building Modern, Installable Web Apps with PWAs: The Ultimate Guide
Favicon
Vite: A quick guide to the next generation front-end building tool
Favicon
Vite: Future of Modern Build Tools
Favicon
Deploy Vite React App to GitHub Pages 4 Step:

Featured ones: