React项目执行npm run build时如何将.env文件移入build文件夹？

可行，你之前的脚本问题出在执行顺序错误：react-scripts build会清空并重新生成build文件夹，先复制文件再执行build的话，刚复制的文件会被清空，导致最终看不到。下面是具体解决方案：

方案1：调整脚本执行顺序 #

把复制命令放到build命令之后，确保build生成文件夹后再复制文件进去。

macOS/Linux（bash环境） #

修改package.json中的build脚本：

"scripts": {
  "build": "react-scripts build && cp .env build/.env"
}

如果是复制.env.template并改名为.env：

"scripts": {
  "build": "react-scripts build && cp .env.template build/.env"
}

Windows（cmd环境） #

Windows下用copy命令替代cp：

"scripts": {
  "build": "react-scripts build && copy .env build\\.env"
}

复制模板文件的版本：

"scripts": {
  "build": "react-scripts build && copy .env.template build\\.env"
}

方案2：跨平台兼容方案（推荐） #

如果项目需要在不同操作系统运行，用copyfiles包实现跨平台文件复制：

1. 安装依赖：

npm install copyfiles --save-dev

2. 修改package.json的build脚本：

"scripts": {
  "build": "react-scripts build && copyfiles -f .env build/"
}

复制模板文件并重命名的版本：

"scripts": {
  "build": "react-scripts build && copyfiles -f .env.template build/.env"
}

-f参数用于强制覆盖已存在的文件，避免执行时报错。

注意事项 #

• 若.env包含敏感信息（如密钥、API地址），建议只复制.env.template，部署时再手动填充真实配置，同时确保.env被加入.gitignore，避免敏感信息泄露。
• 如果你用的是自定义React脚手架而非create-react-app，只需确认build命令是否会清空build文件夹，调整复制顺序即可。

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