Eslintでformatに関してはreportしてくれますが、typescriptのtypeエラーは出してくれなかったりします。これらはbuild時に出るエラーで、気軽に確認できると開発が楽になります。そこで、typescriptのtype errorを感知する方法を紹介します。すごく簡単で、yarn run tsc --noemit
error TS6059: File is not under rootDir is expected to contain all source files.
The file is in the program because Matched by default include patternのエラーが出たときの対処方法を紹介します。とても簡単でincludeやexcludeを使えば解決できます。
BigInt literals are not available when targeting lower than ES2020.ts(2737)のエラーが出た時の対処方法を紹介します。これは、10nのようなBigInt literalを使ったとき、かつ、libがes2020以下の時に起こります。そのため、対処方法は簡単で、tsconfig.jsonのlibをes2020以上にしたら大丈夫です。
Argument of type string is not assignable to parameter of type never TS2345のようなエラーが出た時の解決方法を紹介します。このエラーは代入先の配列との型があっていないことにより生じます。そのため、代入先と代入基との型を合わせてあげれば解決できます。
error TS7053: Element implicitly has an 'any' type because expression of type 'string' can't be used to index typeのエラーが出た時の対処方法を紹介します。解決方法はobjectに型を定義してあげることです。[key: string]: stringとすることでkeyに入る部分はstring型であることを明示します。 そうすることで、indexとして使われる際にはstring型を許容するようになり、buildエラーも無くなります。
'example.ts' cannot be compiled under '--isolatedModules' because it is considered a global script file. Add an import, export, or an empty 'export {}' statement to make it a module.ts(1208)
Line: React Hook useState cannot be called inside a callback. React Hooks must be called in a React function component or a custom React Hook function react-hooks rules-of-hooksのエラーが起きる原因と解消方法の解説
Line 39:1: foo import should occur before import of ../hoge import/orderのようなエラーが出た時の対処方法を紹介します。これはそのままの意味で、`foo`というコンポーネントのimportは`../hoge`のコンポーネントの前でimportしてねという意味です。importの順番を変えてあげれば解消できます!