内联导入导出组件在热重载时抛出错误

Question

关于上下文，让我试着解释一下。

在我的项目中，我有一个文件夹，例如，用于存放组件。 在该文件夹中，我有我的组件文件和一个 index.js 文件，我在其中导入所有组件并导出，而不是在同一行中，如下所示：

export { default as Button } from './button'
export { default as Loader } from './loader'
export { default as ImageBackground } from './image-background'

所以我可以像这样在屏幕组件中导入这些组件：

import { Button, Loader, ImageBackground } from 'src/components'

如果我编辑组件文件，保存并重新加载项目，一切正常。

问题是，当我在激活热模块替换（热重载）的情况下编辑任何这些组件时，当它在编辑后被触发时，它会引发以下错误：

未处理的 JS 异常：需要模块“src/components/index.js”，引发异常：TypeError：无法重新定义属性：按钮

有人知道为什么会这样吗？

提前致谢！

Obs：当我不使用 index.js 直接导入组件时，或者如果在 index.js 内部，我首先导入组件，然后将组件分配给变量，然后导出此变量，它工作正常。

Answer 1

当我在 react 组件中将 render = () => (...) 更改为 render(){ return (...)} 时，我的问题得到了解决