Reactjs 在部署时创建不同的react应用程序/材质UI应用程序样式

我有一个特定的错误，我不知道如何调试。问题在于，我通过material ui和常规CSS为

create react app

（Typescript）应用程序使用的样式在开发过程中显示得很好，但在我在线部署应用程序时，某些CSS属性的样式会有所不同（我只尝试过Heroku和Vercel）。当我在开发时，该应用程序不会在控制台中显示任何错误或警告。我不知道为什么会发生这种情况，到目前为止，我已经尝试了以下方法

仔细阅读我的代码，每一步都要格外小心

在Chrome 85.0.4183.83（Linux，64位）上以匿名模式打开网站（开发和生产）

查看material ui的文档（material ui.com）和React文档，以了解这方面的任何线索

搜索谷歌搜索之前的此类问题

到目前为止，没有任何结果。有人能给我指一下正确的方向吗

部署后我在Heroku上使用的构建包是mars提供的众所周知的构建包，可在以下站点获得

为了方便起见，我将我的

package.json

包含在pastebin中

非常感谢你的帮助

================编辑=============

我一直在试验这些代码，问题似乎在于如何在构建期间编译材质ui。开发中没有出现的问题，在生产中就出现了

例如，我注意到的最重要的一点是，如果将材质ui组件提供的自定义样式道具标志混合在一起，并将自己的样式添加到

className

或

style

，则在构建期间，这些后一种样式会被部分覆盖（如果不是完全覆盖的话）

所以如果我这样做了

import   React,
       { useRef }  from "react";
import {
         Button,
         makeStyle,
         Theme
       }           from "@material-ui/core";
/*
Start of functional component using memo
.
.
.
*/

const useClasses = useRef(makeStyle((theme : Theme) => { return {
      buttonStyles:
      {
          backgroundColor: theme.palette.text.hint
      }
}}));

const styles = useClasses.current();

<Button
    color={"secondary"}
    className={styles.buttonStyles}>
    button text
</Button>
/*
.
.
.
*/

import-React，
{useRef}来自“react”；
进口{
按钮
制作风格，
主题
}来自“@材料界面/核心”；
/*
使用备忘录启动功能组件
.
.
.
*/
const useClasses=useRef（makeStyle（（theme:theme）=>{return{
按钮样式：
{
背景色：theme.palete.text.hint
}
}}));
const styles=useClasses.current（）；
按钮文本
/*
.
.
.
*/

在开发中，按钮将具有

背景色

我在

makeStyles

中给出的，但在生产中，该属性将切换到

次要属性

，如

颜色

道具中给出的，默认值为

主题.palete.secondary.main

有时，甚至在没有任何额外配置的情况下使用MaterialUI中的组件也会导致问题

---

如果有必要，我还将代码拆分与

lazy

和

suspent

一起使用。

StackMatch您可以链接您的github/gitlab repo吗？我想我可能知道问题出在哪里，但如果不了解您的开发环境是如何配置的，我就无法确定了。

嗨，Andrew，感谢您主动提出查看我的代码。我目前正在删除任何敏感信息，并准备将项目上载到Github。我应该在几个小时内准备好，我会把链接粘贴到这里。当你看到它时请告诉我，这样我就可以把它取下来。还请看我对我的问题所做的编辑，这可能会对问题所在有更多的了解。