Next.jsで不要なファイルを一掃する

Knipというツールが便利。JaveScriptやTypeScriptで書かれているプロジェクトの未使用のファイルやexportを見つけることができる。

Find unused files, dependencies and exports in JavaScript and TypeScript projects
https://knip.dev/

インストールせずに使いたいのでnpxコマンドを使って実行する。

npx knip

また、Next.jsのプロジェクトで使いたいのでプラグインを導入する。
https://knip.dev/reference/plugins

上記のプラグインの中にNext.jsがあるのでこれを使う。
https://knip.dev/reference/plugins/next

knip.jsonというファイルをプロジェクトのルートに配置する。除外したいディレクトリはignoreで指定できる。

{
  "ignore": [
    "hoge"
  ],
  "next": {
    "entry": [
      "next.config.{js,ts,cjs,mjs}",
      "{instrumentation,middleware}.{js,ts}",
      "app/global-error.{js,jsx,ts,tsx}",
      "app/**/{error,layout,loading,not-found,page,template,default}.{js,jsx,ts,tsx}",
      "app/**/route.{js,jsx,ts,tsx}",
      "app/{manifest,sitemap,robots}.{js,ts}",
      "app/**/{icon,apple-icon}.{js,jsx,ts,tsx}",
      "app/**/{opengraph,twitter}-image.{js,jsx,ts,tsx}",
      "pages/**/*.{js,jsx,ts,tsx}",
      "src/{instrumentation,middleware}.{js,ts}",
      "src/app/global-error.{js,jsx,ts,tsx}",
      "src/app/**/{error,layout,loading,not-found,page,template,default}.{js,jsx,ts,tsx}",
      "src/app/**/route.{js,jsx,ts,tsx}",
      "src/app/{manifest,sitemap,robots}.{js,ts}",
      "src/app/**/{icon,apple-icon}.{js,jsx,ts,tsx}",
      "src/app/**/{opengraph,twitter}-image.{js,jsx,ts,tsx}",
      "src/pages/**/*.{js,jsx,ts,tsx}"
    ]
  }
}

実行すると下記のように出てくる。package.jsonのdependenciesなどの未使用モジュールも出してくれるので便利。

Unused files (1)
src/hoge.ts
Unused dependencies (2)
hoge  package.json
huga  package.json
Unused devDependencies (2)
hoge  package.json
huga  package.json
Unlisted dependencies (1)
eslint-plugin-import                   .eslintrc.json
Unresolved imports (1)
../hoge  src/index.test.tsx:10:4
Unused exports (1)                                       
hoge                        unknown   src/hoge.ts:8:14
Unused exported types (8)
...
Unused exported enum members (1)
...
Duplicate exports (1)
...