Javascript React.js应用程序在开发模式下工作正常，但在构建后出现错误（生产模式） 错误

好吧，我已经花了好几个小时试图找出为什么会出现这个错误（只有在运行build时）：

建筑 环境

• NodeJS:15.2.0
• ReactJS:16.13.1
• 纱线：1.22.5

我做什么 在我的主文件RentalsList.js中，我：

从我的API上的/rentals获取有关componentDidMount（）的一些数据

使用API的答案更新状态

使用RentalListItem（./RentalListItem.js）作为此表的项显示组件（../Table/Table.js）。为了实现这一点，我将RentalListItem作为道具传递到命名的TableItem中

表组件的名称如下所示：

以下是API返回的数据示例：

[
{
“名字”：“某个名字”，
“参考文件”：“AB01234”，
“供货日期”：1605237860，
“成本”：123.45，
“类型”：0，
“状态”：“可用”，
“_id”：“5f667cb47919fda09795ccad”，
“地址”：{
“数字”：1，
“道路类型”：“街道”，
“方式名称”：“名称”，
“邮政编码”：12345，
“城市”：“StackyCity”，
_id:“5fadfc0e2add5eb934c497bb”
},
“添加人”：{
“名字”：“我”，
“姓氏”：“和我自己”，
“_id”：“5fac8ca0b86ee219381252eb”，
“机构”：{
“ref”：“CD56789”，
“名称”：“机构名称”，
“电子邮件”：an@email.com",
_id:“5fac8f3db86ee219381252ec”
}
}
}
]

我的问题 在开发模式下运行时，我没有任何错误。事实上，我只有在构建代码后才会出现此错误（对于生产环境）

为什么在生产模式中会出现此错误

研究轨道

• 我注意到在

  纱线构建之后

  ，我的组件rentallitem被呈现为函数t（e），但当我尝试将其作为函数调用时，它告诉我这是一个类。嗯：）

• 当直接调用RentalListItem作为RentalList上的组件时，我没有错误

• 在Table.js中，调用this.props.TableItem时似乎定义得很好

---

我怀疑这与JSX有关：

<this.props.TableItem index={index} ... />

试着这样写：

const TableItem = this.props.TableItem

...

<TableItem index={index} ... />

const TableItem=this.props.TableItem
...

---

我相信您的代码是有效的JSX，但像这样使用点符号并不常见，我的理论是构建过程的某些部分错误地转换了它。为了准确地理解造成这种情况的原因，我们需要知道您的构建设置是什么样子。

好吧，您是对的！多谢各位<代码>纱线构建调用

react脚本构建

我忘了提到：）

const TableItem = this.props.TableItem

...

<TableItem index={index} ... />