React のシンタックスエラーをデバッグ
Reactのチュートリアルをこなしているが、シンタックスエラーがあると画面が表示されないだけでどこでエラーが発生しているかわからない。
1.Chrome の拡張機能を使ってデバッグ
1.1 拡張機能をインストール
https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi
1.2 設定を変更
上記URLにアクセスし以下2か所を有効
- バックグラウンドページ
- ファイルのURLへのアクセスを許可する
1.3 デバッグツールを起動し、React タブを選択
コンポーネントを選択することで、状態だったりが分かりそう。
1.4 シンタックスエラー
シンタックスエラーがあると、表示される！これは捗るな。
以上
