@情感/反应ThemeProvider不起作用

Question

操作系统信息。Macbook (M1 Pro)蒙特利12.1

libs版本信息。反应: 17.0.2，@情感/反应: 11.7.1，@情感/风格: 11.6.0

大家好。我有问题。

当我使用造型组件的时候。它起作用了，但没有情感/风格。为什么“情绪/反应”的ThemeProvider不工作？

这是我的密码。

App.tsx
...
import theme from '.styles/theme';
import { ThemeProvider } from '@emotion/react';
...
<ThemeProvider theme={theme}>
   <Component />
</ThemeProvider>



./styles/theme.ts
...
import { Theme } from '@emotion/react';
const theme: Theme = {
  ...
  color: 'red' //simple test code
};
export default theme;


./components/component.tsx
...
import styled from '@emotion/styled';
const Button = styled.button`
  color: ${(props) => props.color}
`;
const Component: React.FC = () => {
  return <Button />
};
export default Component;

Answer 1

我解决了!！只需要熟食模块类型。

(前)

./types/Theme.ts
import '@emotion/react'; // it's important to use ThemeProvider
declare module '@emotion/react' {
  export interface Theme {
    color: string;
  }
}