【初心者メモ】Gatsby+TypeScriptにおけるCSS Modulesエラー

事象

GatsbyのチュートリアルをTypeScriptに読み替えながら実施している際、以下のエラーが吐かれた。

// Cannot find module './style.module.css'.
import { style } from "./style.module.css";

解決策

next.jsでの対処方法を参考に、以下の手順で解決した。

1. プロジェクトフォルダ直下にgatsby-env.d.tsを作成
2. tsconfig.jsonのincludeに上記のファイルを追加する

gatsby-env.d.ts

declare module "*.css";
declare module "*.scss";

tsconfig.json

  "include": [
    ...,
    "./gatsby-env.d.ts"
  ],

参考

https://blog.shimar.me/2020/12/05/nextjs-css-cannot-find-module
https://www.gatsbyjs.com/docs/tutorial/part-2/