Typescript 推断类型无法在没有引用的情况下命名

Question

我的项目的设置是tsdx（基于Rollup和Typescript）。
在我的 IDE (vscode) 中工作一切看起来都很好，甚至运行也yarn tsc没有错误。

当我运行时yarn build（即tsdx build），我收到以下错误：

(typescript) Error: /home/me/dev/app/src/components/alert/Alert.tsx(36,7): semantic error TS2742: The inferred type of 'AlertContainer' cannot be named without a reference to '@emotion/serialize/node_modules/csstype'. This is likely not portable. A type annotation is necessary.
Error: /home/me/dev/app/src/components/alert/Alert.tsx(36,7): semantic error TS2742: The inferred type of 'AlertContainer' cannot be named without a reference to '@emotion/serialize/node_modules/csstype'. This is likely not portable. A type annotation is necessary.

错误中引用的代码是：

(typescript) Error: /home/me/dev/app/src/components/alert/Alert.tsx(36,7): semantic error TS2742: The inferred type of 'AlertContainer' cannot be named without a reference to '@emotion/serialize/node_modules/csstype'. This is likely not portable. A type annotation is necessary.
Error: /home/me/dev/app/src/components/alert/Alert.tsx(36,7): semantic error TS2742: The inferred type of 'AlertContainer' cannot be named without a reference to '@emotion/serialize/node_modules/csstype'. This is likely not portable. A type annotation is necessary.

我究竟做错了什么？我该如何修复它？
我尝试了这个解决方案，但没有成功。

Answer 1

这对我有帮助

import { StyledComponent } from '@emotion/styled';
import type { BoxProps } from '@mui/material/Box';
import Box from '@mui/material/Box';
import { styled } from '@mui/material/styles';

export const BoxStyled: StyledComponent<BoxProps> = styled(Box)(({ theme }) => ({ .......