如何将 MUI 主题从我的应用程序传播到自定义 MUI 组件的第 3 方库？

Question

我正在创建一个自定义 MUI 组件库，该库将被多个应用程序重用。我希望组件库能够反映应用于使用该库的应用程序的主题。

这里的存储库中包含 MUI 表的简单示例库：

https://github.com/jantal80/jaa-component-library

我在这里发布到 npm：

https://www.npmjs.com/package/jaa-my-component-library

现在我使用

vite npm create vite@latest

创建一个简单的应用程序：

https://github.com/jantal80/jaa-app

...直接使用 MUI 表，以及从 jaa-my-component-library 导入的“JaaTable”。我用 ThemeProvider 包装应用程序，并且该主题应用于导入到应用程序的 MUI 表，但 不 应用于“JaaTable”

我在库的 package.json 中有 @mui/material 作为对等依赖项。

如何让主题从应用程序传播到库组件？我使用过至少响应暗/亮模式主题的其他第三方库，所以这似乎是可能的，但我还没有找到一种方法来做到这一点。我发现了一些类似的 stackoverflow 问题，但没有一个可以为我解答。

蒂亚！

主题不改变gif

Answer 1

事实证明我的代码没问题，是package/vite/tsconfig设置。 我找到了一个使用 vite 的库（mui-color-input），并且还对深色/浅色主题设置做出了适当的响应。然后我逐行将其与我所拥有的进行比较，并做出相应的更改。我相信即使我在对等依赖项中有@mui，仍然存在依赖项冲突。 index.d.ts 也没有被写入 dist。