React中如何实现.env文件动态化，从Linux环境变量取值？

核心思路 #

把.env做成模板文件留存Git，用环境变量作为占位符，在服务器部署时自动用本地已导出的环境变量替换占位符，生成实际的.env文件，同时把实际.env排除在Git之外，这样就能在所有服务器上复用模板。

具体操作步骤 #

• 制作.env模板
  把原.env重命名为.env.template，把需要动态填充的配置项改成${环境变量名}格式的占位符。比如你原来的ENV_TYPE: #myVariable，改成ENV_TYPE: ${MY_ENV}。
  示例模板内容：

  ENV_TYPE: ${MY_ENV}
  DB_HOST: ${DB_HOST}
  DB_PORT: ${DB_PORT}
  

• 配置Git忽略实际.env
  在.gitignore里加一行：

  .env
  

  这样实际生成的.env不会被提交到Git，模板文件.env.template正常提交即可，方便所有服务器共用。

• 在Linux上生成动态.env
  方法一：用通用的envsubst命令（大部分Linux系统自带），一键替换所有占位符：

  # 先确保已经导出环境变量，比如export MY_ENV='Test'
  envsubst < .env.template > .env
  

  这个命令会自动把模板里所有${变量名}替换成对应的环境变量值，省心又不容易出错。

  方法二：写个简单的Shell脚本（比如setup-env.sh）手动替换：

  #!/bin/bash
  cp .env.template .env
  sed -i "s/\${MY_ENV}/$MY_ENV/g" .env
  # 如果有其他变量，继续添加sed替换行即可
  

  给脚本加执行权限：chmod +x setup-env.sh，导出环境变量后运行脚本就能生成目标文件。

• 集成到启动流程
  要是有应用启动脚本，可以把生成.env的步骤嵌进去，确保每次启动都用最新的环境变量：

  envsubst < .env.template > .env && ./你的启动脚本.sh
  

注意事项 #

• 执行前要确保服务器上已经导出了所有需要的环境变量，也可以直接在命令行临时设置，比如：

  MY_ENV='Test' DB_HOST='localhost' envsubst < .env.template > .env
  

• 如果环境变量里有特殊字符（比如/），用sed的时候要注意转义，优先用envsubst更稳妥。

内容的提问来源于stack exchange，提问作者ks1705