JSライブラリを1日1つ紹介する
1日1つJSのライブラリを調べます。
① ライブラリに関するドキュメントを最初から最後まで読む
② 実際に使ってみる or 使い方を調べる
③ ライブラリを3行で説明する
本日は、tslint-react-hooksのドキュメントを読んで実際に業務で使っているところを調べました。
ドキュメント
今回読んだドキュメントはこちらです。
GitHub - Gelio/tslint-react-hooks: TSLint rule for detecting invalid uses of React Hooks
Philosophy、Motivation、Back Story
なし
実際に使ってみる && わからなかったところ
※今回のライブラリは英語が難しくて自信がありません。。。以下の文は半信半疑で読んでください。
このライブラリは、TypeScriptとReactとhooksを使っている人のための静的解析ツールです！！
Rubyでいうrubocop的なツールで、コードに対してルールを設定できるのでそのルールから外れていることを機械的にチェックすることができます。
ESLint plugin for react hooksがベースになっていて、それのTypeScriptに対応させたもののようです。
React hooksの以下のコードを検出する機能を持っています。（検出して、ルールから外れていたら教えてくれるのかな...？）
潜在的に条件付きのブランチ内でReactフックの使用を検出します。
- if文
- 条件式（&&、||）
- 三項演算子
- ループ（while、for、do ... while）
- それ自体がカスタムフックまたはコンポーネントではない関数
- React hooksを使った悪い早期returnの検出
などなど
ESlintとかだと公式ドキュメントがあるので、ルールの説明が読めるのですがそのようなサイトがなさそう...？
eslintベースなので、そこを見ろって意味なのですかね...
eslint.org
3行でまとめる
tslint-react-hooksを導入すると、
- ReactでhooksとTypeScriptを使っている環境で静的解析ができる。
以上です！
