时间戳

首页 > 解决方案 > Typescript 使用最新的样式组件引发错误

reactjs - Typescript 使用最新的样式组件引发错误

问题描述

我有一个使用 React、TypeScript 和样式组件的项目。我已经在这个项目上工作了一段时间，然后决定将 styled-components 升级到最新版本，即5.1.1（2.4.1以前是）。因此，该项目编译并正常运行，但是当我尝试实际构建它时，它会引发以下错误：

node_modules/@types/styled-components/ts3.7/index.d.ts:151:69 - error TS2694: 
Namespace '"C:/path/node_modules/hoist-non-react-statics/index"' has no exported member 'NonReactStatics'.

151     string & StyledComponentBase<C, T, O, A> & 
hoistNonReactStatics.NonReactStatics<C extends React.ComponentType<any> ? C : never>;

node_modules/@types/styled-components/ts3.7/index.d.ts:253:65 - error TS2344: 
Type 'C' does not satisfy the constraint 'ComponentType<any>'.
  Type 'ElementType<any>' is not assignable to type 'ComponentType<any>'.
    Type '"symbol"' is not assignable to type 'ComponentType<any>'.
      Type 'C' is not assignable to type 'FunctionComponent<any>'.
        Type 'ElementType<any>' is not assignable to type 'FunctionComponent<any>'.
          Type '"symbol"' is not assignable to type 'FunctionComponent<any>'.

253     ? React.ComponentPropsWithRef<StyledComponentInnerComponent<C>>

我尝试了不同版本的 TypeScript、旧版本的样式组件、新版本的 Node.js，但所有这些都给了我各种错误。tsconfig.json一些设置只抛出两个错误，其他抛出 15 个错误。如果它有助于理解问题，我可以附上我的。我的 TypeScript 版本目前是3.7.

据我了解，styled-components 用于满足其需求的包内部存在一些不兼容性。但我不知道如何解决它们。

标签： reactjstypescriptstyled-components

解决方案

推荐阅读