Emotion入れたら “Property ‘css’ does not exist on type ‘DetailedHTMLProps” のエラー

React + Typescript で作成したプロジェクトに Emotion を導入した場合、下記エラーになることがあります。

Property 'css' does not exist on type 'DetailedHTMLProps

この場合、tsconfig.json に下記を追加します。

//tsconfig.json
{
  "compilerOptions": {
    "types": ["@emotion/react/types/css-prop"]
  }

これでエラーが出なくなるかと思います。

通常HTMLにcssという属性がないのでTSエラーになりますが、この設定を追記することで css-prop の書き方をすることができるようになります。

参考

TS2322: Property 'css' does not exist... · Issue #1249 · emotion-js/emotion

emotion: version: 10.0.7 emotion-theming: 10.0.7 @emotion/core: version: 10.0.7 @emotion/styled: version: 10.0.7 @emotio...

github.com