.env.development

Once you have mastered the basics, you can explore advanced techniques that leverage the full power of .env.development.

To prevent your project from descending into "environment variable hell," follow these battle-tested principles.

Install dotenv:

npm install dotenv

Create config.js:

const path = require('path');
require('dotenv').config(
  path: path.join(__dirname, `.env.$process.env.NODE_ENV`)
);
console.log(Loading config for: $process.env.NODE_ENV);
module.exports =  ...process.env ;
 .env.development

Run your app:

NODE_ENV=development node server.js
// Loads .env.development

# .env.development
API_URL=http://localhost:3000
DEBUG=true
SECRET_KEY=dev_secret_123   # never reuse production secrets
PORT=4000

Most modern frameworks (React with Vite, Next.js, Vue, Node.js with dotenv, Django, Laravel, etc.) support the following file precedence:

echo "API_BASE=/api" >> .env.development echo "LOG_LEVEL=debug" >> .env.development Once you have mastered the basics, you can

CRA popularized the pattern of .env.development. It automatically loads:

Important caveat: In React apps (and most frontend frameworks), environment variables must be prefixed with REACT_APP_ (or VITE_, NEXT_PUBLIC_) to be exposed to the browser. Create config

# .env.development
REACT_APP_API_URL=http://localhost:3001
REACT_APP_ENABLE_MOCKS=true