如何修改npm run start命令，在执行前复制文件到指定位置？

不需要修改react-scripts源码，直接通过npm脚本就能实现预启动的文件复制操作，以下是几种实用方案：

方案1：Windows原生命令快速实现 #

直接利用Windows的xcopy命令在启动前复制文件，修改项目根目录的package.json中scripts字段：

"scripts": {
  "copy-api": "xcopy /E /Y \"src/api/*.php\" \"C:\\Users\\[user]\\Local Sites\\[myApp]\\app\\public\\api\"",
  "start": "npm run copy-api && react-scripts start"
}

• 参数说明：/E会复制子目录（如果你的api文件夹有层级），/Y表示覆盖目标文件时不弹出确认提示
• 注意路径中的反斜杠要写成双反斜杠\\，这是JSON语法的转义要求

方案2：跨平台工具（兼容Windows/macOS/Linux） #

如果需要跨平台支持，或者不想记系统命令，用copyfiles这个npm工具：

1. 先安装依赖：

npm install copyfiles --save-dev

2. 修改package.json的scripts：

"scripts": {
  "copy-api": "copyfiles -u 1 src/api/**/*.php \"C:/Users/[user]/Local Sites/[myApp]/app/public/api\"",
  "start": "npm run copy-api && react-scripts start"
}

• 参数说明：-u 1表示去掉源路径最外层的src目录，直接把api下的文件复制到目标目录；路径用正斜杠/即可跨平台兼容

进阶优化：监听API文件变化自动同步 #

如果开发时经常修改PHP接口文件，想实时同步到WP目录，搭配nodemon实现监听自动复制：

1. 安装依赖：

npm install nodemon --save-dev

2. 更新scripts：

"scripts": {
  "copy-api": "copyfiles -u 1 src/api/**/*.php \"C:/Users/[user]/Local Sites/[myApp]/app/public/api\"",
  "watch-api": "nodemon --watch src/api --ext php --exec \"npm run copy-api\"",
  "start": "npm run copy-api && npm run watch-api & react-scripts start"
}

这样启动项目时，会同时监听src/api下所有.php文件的变化，一旦修改就自动执行复制操作，无需手动重启命令。

为什么不用修改react-scripts？ #

create-react-app的设计就是通过npm scripts扩展功能，直接修改node_modules里的源码会导致后续升级react-scripts时丢失修改，而且完全没必要——npm脚本本身就支持串联、预执行命令，这是官方推荐的扩展方式。

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