React.js 我在 prod 中有 Bug，但在 dev 模式下没有，你能帮帮我吗

Question

我已经有3天的问题了，我真的不明白是什么导致了这个错误，你能帮我吗？

这就是问题所在，我创建了一个小游戏（react.js），其中每次重新加载时显示 5 张卡片，这 5 张卡片每张都有一个分数，每次累积，这给出了所有卡片的分数，然后累积的每个“手”的分数。

在开发模式下，一切正常，但如果我构建并将其放在 cdn (netlify) 上，则分数逻辑不起作用......

产品链接（错误）： https ://are-you-lucky-game.netlify.app/

Github repo 链接（开发模式工作正常）： https ://github.com/rodolphe37/random-playing-card-tuto/tree/step-3-final

我认为问题可能来自这里：

在我的控制台上渲染（在开发中）

score: undefined
classment from ScoreForm {pts: 0, name: ''}
scoreArray (5) [3, 7, 10, 15, 2]
classment from center Page {pts: 0, name: ''}
classment from state {pts: 0, name: ''}
classment from session  {pts: 0, name: ''}

score: undefined
classment from ScoreForm {pts: 0, name: ''}
scoreArray (5) [3, 7, 10, 15, 2]
classment from center Page {pts: 0, name: ''}
classment from state {pts: 0, name: ''}
classment from session  {pts: 0, name: ''}

score: 0
classment from ScoreForm {pts: 37, name: ''}
score: 37

在开发中，我的组件被渲染了几次（我认为是 3 或 4 次），并且在最后一次渲染时，信息就在那里。

在我的控制台中（产品模式）

score: undefined
classment from ScoreForm {pts: 0, name: ''}
scoreArray (5) [5, 25, 3, 6, 1]
classment from center Page {pts: 0, name: ''}
classment from state {pts: 0, name: ''}
classment from session  {pts: 0, name: ''}
score: 0
classment from ScoreForm {pts: 0, name: ''}``

在生产中，我认为我的组件被渲染了两次，所以我的值不存在。

如何确保我的信息（它来自 sessionStorage）出现在每个组件的第一次渲染中？

如果您曾经遇到过这种错误，或者您认为您有适合我的解决方案，我很感兴趣。

提前致谢！

Answer 1

我可以在您的存储库中看到您在 package.json 中使用browserslist这在 react-create-app 中很常见，因为该库将根据提供的配置捆绑您的代码。 请注意，您有两种不同的开发和生产配置，请尝试将开发中的相同配置也用于生产对象，这应该可以解决您的问题。