部署React应用时prevState语句出现语法错误如何解决？

问题重现 #

本地VS Code无语法提示错误，但部署时在以下代码的...prevState位置报SyntaxError: ... Unexpected token：

useEffect(() => {
  setState((prevState) => ({ ...prevState, calls: fetchedCalls }));
}, [fetchedCalls]);

对应的状态定义：

const [state, setState] = useState({
  view: "Feed",
  back: null,
  id: null,
  call: null,
  calls: [],
});

移除当前语句后，其他类似使用扩展运算符的setState语句仍会报错。

解决步骤 #

• 检查部署环境的ES6支持：扩展运算符是ES6特性，部分旧版部署环境（如低版本Node.js）未默认支持，需确保构建环节能转译ES6代码
• 确认Babel配置：
  • 若使用Create React App，无需手动配置，但如果曾执行过eject，需检查babel.config.js中是否包含@babel/plugin-proposal-object-rest-spread插件；若未eject，可尝试升级react-scripts到最新稳定版
  • 若为自定义Webpack配置，需在babel-loader的插件列表中添加@babel/plugin-proposal-object-rest-spread
• 验证构建命令：本地开发用react-scripts start自带转译，部署时需确保用react-scripts build生成生产代码，避免直接上传未转译的源码
• 配置部署平台的构建规则：部分平台可通过项目根目录的.babelrc或babel.config.json强制启用ES6转译，示例配置：

{
  "presets": ["react-app"],
  "plugins": ["@babel/plugin-proposal-object-rest-spread"]
}

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