项目中常用的 .env 文件原理是什么？如何实现？

最新推荐文章于 2025-09-12 18:17:13 发布

原创

最新推荐文章于 2025-09-12 18:17:13 发布 · 772 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #css #前端 #css3

本文介绍了.dotenv库在项目中的作用，它是一个用于加载.env文件中环境变量到process.env的对象的零依赖模块。文章详细阐述了dotenv的工作流程，包括主要步骤、parse方法解析的数据以及正则表达式的应用。同时，文中提到dotenv-cli作为dotenv的补充工具，并提供了一份前端资源礼包供读者学习。

1. dotenv介绍

Dotenv 是一个零依赖模块，可将 .env 文件中的环境变量加载到 process.env 中。可以使用dotenv-expand来扩展。还有dotenv-cli推荐使用。

//dotenv的使用：
import * as dotenv from 'dotenv' 
dotenv.config()

 //dotenv-cli配置不同的.env文件，不同环境使用不同的脚本命令。
"scripts": {"dev": "dotenv -e .local.env -e .env.dev react-app-rewired start","build": "dotenv -e .env.prod react-app-rewired build","dev:test": "dotenv -e .local.env -e .env.dev react-app-rewired start","dev:prod": "dotenv -e .local.env -e .env.prod react-app-rewired start",},

2.dotenv代码

2.1 dotenv实现的主要流程

1.读取env文件
2.parse解析文件内容生成键值对的对象，返回解析的结果
3. 合并配置到process.env

const fs = require('fs')
const path = require('path')
const os = require('os')

const LINE = /(?:^|^)\s*(?:export\s+)?([\w.-]+)(?:\s*=\s*?|:\s+?)(\s*'(?:\\'|[^'])*'|\s*"(?:\\