Next.js匿名箭头函数触发Fast Refresh状态不保留警告，命名后仍未解决

你收到的 Fast Refresh 警告和你修改的 config.ts 配置文件无关，警告指向的是某个 React 组件文件中匿名导出的函数组件，修改配置文件无法解决这个问题。

解决步骤 #

1. 定位问题文件

• 查看警告的完整输出，一般会附带触发警告的文件路径、行号，直接定位到对应组件文件即可
• 若无明确路径，全局搜索所有 .tsx/.jsx 文件中直接默认导出匿名函数的写法，包括 export default () => <></> 和 export default function() {} 两种形式

2. 修正组件写法
   给所有匿名导出的组件添加显式命名即可，示例如下：

// 错误写法
export default () => {
  return <div>示例组件</div>
}

// 正确写法
const ExampleComponent = () => {
  return <div>示例组件</div>
}
export default ExampleComponent

3. 残留警告排查
   如果所有组件都已经按要求命名，警告仍未消除，按以下步骤操作：

• 检查是否有动态导入的组件未添加命名
• 清理 Next.js 缓存后重启开发服务，执行命令：

rm -rf .next && npm run dev

如果使用 pnpm 或 yarn，替换对应启动命令即可。

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