Material-UI 未定义此类颜色时以靛蓝色呈现的样式组件

Material-UI styled component rendered in indigo when no such color defined

我正在尝试使用 Material-UI 构建 NextJS 应用程序，从我在 https://github.com/phuongnq/nextjs-material-design-boilerplate 找到的样板中汲取灵感。

我的实现可以在 https://github.com/amitschandillia/proost/tree/master/web 进行审查。

有问题的样板文件将默认主题调色板定义为 lightBlue 用于主要，green 用于辅助。但是，它没有为按钮文本颜色明确定义任何内容。默认情况下，所有按钮文本应为 white，但在呈现时，此代码显示 lightBlue 按钮和 black[=34] =] 文本。我的问题是，为什么它要更改按钮的默认文本颜色以及我可以在代码中的何处将其设置为 white?

此外，当我禁用 lib/getPageContext.js 中的调色板定义部分时：

const theme = createMuiTheme({
    palette: {
        // primary: {
        //     light: lightBlue[300],
        //     main: lightBlue[500],
        //     dark: lightBlue[700],
        // },
        // secondary: {
        //     light: pink[300],
        //     main: pink[500],
        //     dark: pink[700],
        // },
    },
});

我在 indigo 中获得了主按钮，而不是 lightBlue 的预期默认值。我尝试查看整个代码库，但在任何地方都找不到这个定义！

文字颜色由主题中的contrastText颜色控制。如果没有明确指定，Material-UI 有一个算法来决定是使用黑色还是白色作为给定背景颜色的文本颜色。

您可以在我的回答中找到语法示例：

您可以在此处找到相关文档：https://material-ui.com/customization/themes/#palette

关于你的第二个问题，控制 default theme can be found here: https://github.com/mui-org/material-ui/blob/master/packages/material-ui/src/styles/createPalette.js#L81

颜色的代码