Why Load Environment Variables in Your package.json Scripts?
If you’ve ever developed a Node.js or TypeScript application, you’re probably familiar with environment variables. These are essential for managing sensitive information, such as API keys and database credentials, without hardcoding them into your code. While using .env files to store these variables is common practice, ensuring they load correctly when running scripts from package.json can be a bit tricky.
Thank me by sharing on Twitter 🙏
For example, if you’re running a TypeScript project, you might have a script like "dev": "tsx watch src/index.ts", which starts the TypeScript watcher. But without loading environment variables, your app might fail to run or operate without access to key information. By integrating dotenv directly into these scripts, we can make sure all required variables are loaded smoothly, right before each script runs. Here’s how I set it up.
How to Set Up dotenv in Your package.json Scripts
Let’s dive in and set this up step-by-step.
Step 1: Install dotenv-cli
To load environment variables easily, I’m using a package called dotenv-cli, which extends the power of dotenv to our command-line scripts. To install it, run:
npm install dotenv-cli --save-devThis package lets us specify .env files directly in our scripts, ensuring the variables load before the main command starts.
The AI-Driven Leader: Harnessing AI to Make Faster, Smarter Decisions
$17.05 (as of November 18, 2025 18:26 GMT +00:00 - More infoProduct prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on [relevant Amazon Site(s), as applicable] at the time of purchase will apply to the purchase of this product.)
The ChatGPT Millionaire: Making Money Online has never been this EASY (How to make money with AI)
$12.95 (as of November 18, 2025 18:26 GMT +00:00 - More infoProduct prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on [relevant Amazon Site(s), as applicable] at the time of purchase will apply to the purchase of this product.)
Co-Intelligence: Living and Working with AI
$14.22 (as of November 18, 2025 18:26 GMT +00:00 - More infoProduct prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on [relevant Amazon Site(s), as applicable] at the time of purchase will apply to the purchase of this product.)Step 2: Add dotenv to Your package.json Script
In package.json, locate the scripts section. I wanted to load my environment variables before starting the TypeScript watcher, so I edited the script as follows:
{
"scripts": {
"dev": "dotenv -e .env -- tsx watch src/index.ts"
}
}This command does two things:
dotenv -e .env --loads the variables from.env.tsx watch src/index.tsstarts the TypeScript watcher, with access to any environment variables loaded bydotenv.
Step 3 (Optional): For Cross-Platform Compatibility, Use cross-env
Some setups require additional compatibility, especially on Windows. By adding cross-env, I can ensure compatibility across different environments.
To install cross-env, run:
npm install cross-env --save-devThen, update the script as follows:
{
"scripts": {
"dev": "cross-env $(dotenv -e .env) tsx watch src/index.ts"
}
}This allows the script to load environment variables in a way that’s compatible with both Windows and Unix-based systems.
Conclusion
Integrating dotenv-cli into your package.json scripts makes loading environment variables quick and hassle-free. Now, whenever I run npm run dev, my .env variables are automatically loaded, keeping my sensitive data secure and my code clean. This setup saves time and avoids issues with missing environment variables, so I can focus on building features instead of troubleshooting configuration.
Give this approach a try and see how it simplifies your workflow!
