Gatsby.jsのTypeScript化 2020

BRANK

個人で Gatsby.js を使い始めたのですが、検索して見つかる Gatsby.js の TypeScript 化についての記事の情報が少し古かったので、自分で書き直してみました。順を追ってスターターパッケージを TypeScript 化していきます。なお今回のコードは全て下記リポジトリにあります。もし、何かエラーになった際は参照してみてください。 2.24.66gatsby-plugin-typegen: 2.2.10. プロジェクトの作成gatsby コマンドを使うめにgatsby-cliの追加。npm install -g gatsby-cli 一番標準の blog のスターターでプロジェクトを作成します。gatsby new gatsby-typscript-sample ここからこのプロジェクトを TypeScript 化していきます。1. tsconfig.jsonの追加最初に、tsconfig.jsonの追加とtypescriptのインストールをします。npx tsc --init yarn add typescript -D tsconfig.jsonは以下のようにして設定します。{ "include": ["./src/**/*"], "compilerOptions": { "target": "esnext", "module": "esnext", "lib": ["dom", "es2017"], "jsx": "react", "strict": true, "esModuleInterop": true, "experimentalDecorators": true, "emitDecorator…