.env 环境变量生成器

可视化编辑 · 模板生成 · 导入导出 · 本地处理不上传

|0 个变量
环境变量列表
选变量名值注释操作
暂无变量，点击上方"添加变量"开始
.env 文件预览

.env 环境变量生成器

在线可视化编辑和管理 .env 环境变量文件，支持多种项目模板，轻松导入导出。

功能特性

可视化编辑

  • 直观的表格界面，轻松添加、编辑、删除环境变量
  • 实时验证变量名格式，避免语法错误
  • 支持变量值显示/隐藏切换，保护敏感信息

模板支持

内置多种项目模板，一键生成常用环境变量：

  • Node.js 基础 - NODE_ENV、PORT、HOST 等
  • Vue.js / Vite - VITE_APP_ 系列变量
  • React / CRA - REACT_APP_ 系列变量
  • 数据库配置 - DB_HOST、DB_PORT、DB_USER 等
  • JWT / 认证 - JWT_SECRET、JWT_EXPIRES_IN 等
  • Docker / 部署 - APP_NAME、LOG_LEVEL、CORS_ORIGIN 等

导入导出

  • 支持导入现有 .env 文件，自动解析变量和注释
  • 一键导出为标准 .env 格式文件
  • 支持复制到剪贴板，方便粘贴使用

高级功能

  • 变量搜索过滤，快速定位目标变量
  • 拖拽排序，自由调整变量顺序
  • 批量选择操作，提高效率
  • 实时预览生成的 .env 文件内容
  • 支持添加注释，提高配置文件可读性

使用场景

1. 新项目初始化

选择对应模板，快速生成项目所需的环境变量骨架，无需手动创建。

2. 团队协作

统一环境变量格式，通过导出/导入功能在团队成员间共享配置模板。

3. 多环境管理

为开发、测试、生产环境分别创建环境变量集，避免配置混乱。

4. 配置审查

导入现有 .env 文件，可视化审查变量配置，发现潜在问题。

环境变量规范

命名规范

  • 使用大写字母和下划线：API_KEY, DB_HOST
  • 不以数字开头
  • Vue/Vite 项目变量需以 VITE_ 开头
  • React (CRA) 项目变量需以 REACT_APP_ 开头

值规范

  • 包含空格的值建议使用引号：MESSAGE="Hello World"
  • 敏感信息（密码、密钥）建议启用隐藏显示
  • 布尔值建议使用 true/false 或 1/0

常见问题

Q: 生成的 .env 文件应该放在哪里？

A: 通常放在项目根目录，命名为 .env。不同框架可能支持多个环境文件，如 .env.development、.env.production。

Q: 如何保护敏感信息？

A: 不要将包含真实密码、密钥的 .env 文件提交到版本控制系统。在 .gitignore 中添加 .env 忽略配置文件。

Q: 为什么我的变量在 Vue/Vite 中访问不到？

A: Vite 要求客户端可访问的环境变量必须以 VITE_ 为前缀。

安全提示

⚠️ 重要：

  • .env 文件可能包含数据库密码、API 密钥等敏感信息
  • 切勿将真实生产环境的 .env 文件上传到公开平台
  • 建议将 .env 添加到 .gitignore 文件
  • 使用 .env.example 文件存储示例配置（不含真实值）供团队参考

相关工具