青いやつの進捗日記。

メモとしてべんきょうのしんちょくをかいていきます。あとで自分が検索しやすいもん

react-responsiveでレスポンシブ対応。TypeScriptで使う場合は@types/react-responsiveも必要

www.npmjs.com

github.com

qiita.com

Reactでレスポンシブするときに普通にStyled-Componentで@media〜とか書いてやるのかなーと思っていたらこれよく使うと。便利ですねこれ。画面幅によって要素がそもそも全然違う時とかはこれでコンポーネントごとそもそも出し分けたほうが良い、ということで良いのかな。

で、上記の参考サイト見つつ

$ yarn add react-responsive

して

import MediaQuery from "react-responsive";

すると

モジュール 'react-responsive' の宣言ファイルが見つかりませんでした。'/Users/[ユーザー名]/Documents/git/za/node_modules/react-responsive/dist/react-responsive.js' は暗黙的に 'any' 型になります。
  存在する場合は `npm install @types/react-responsive` を試してください。または、`declare module 'react-responsive';` を含む新しい宣言 (.d.ts) ファイルを追加します。ts(7016)

(ユーザー名だけ隠しました)

と怒られます。

$ yarn add @types/react-responsive 

すれば解決します。