Next.jsのプロジェクトにgraphql-codegenを導入しようとしたら次のエラーが出た。

$ yarn codegen init                                                                                                                          6.3s  2023/09/17 PM 10:28:29
yarn run v1.22.19
$ graphql-codegen init
node:internal/modules/cjs/loader:1080
  throw err;
  ^

Error: Cannot find module 'string-width'
Require stack:
- /Users/tawachan/Documents/Codes/parthenon-front/node_modules/cliui/build/index.cjs
- /Users/tawachan/Documents/Codes/parthenon-front/node_modules/yargs/build/index.cjs
- /Users/tawachan/Documents/Codes/parthenon-front/node_modules/yargs/index.cjs
- /Users/tawachan/Documents/Codes/parthenon-front/node_modules/@graphql-codegen/cli/cjs/config.js
- /Users/tawachan/Documents/Codes/parthenon-front/node_modules/@graphql-codegen/cli/cjs/cli.js
- /Users/tawachan/Documents/Codes/parthenon-front/node_modules/@graphql-codegen/cli/cjs/bin.js
    at Module._resolveFilename (node:internal/modules/cjs/loader:1077:15)
    at Module._load (node:internal/modules/cjs/loader:922:27)
    at Module.require (node:internal/modules/cjs/loader:1143:19)
    at require (node:internal/modules/cjs/helpers:121:18)
    at Object.<anonymous> (/Users/tawachan/Documents/Codes/parthenon-front/node_modules/cliui/build/index.cjs:291:21)
    at Module._compile (node:internal/modules/cjs/loader:1256:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1310:10)
    at Module.load (node:internal/modules/cjs/loader:1119:32)
    at Module._load (node:internal/modules/cjs/loader:960:12)
    at Module.require (node:internal/modules/cjs/loader:1143:19) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    '/Users/tawachan/Documents/Codes/parthenon-front/node_modules/cliui/build/index.cjs',
    '/Users/tawachan/Documents/Codes/parthenon-front/node_modules/yargs/build/index.cjs',
    '/Users/tawachan/Documents/Codes/parthenon-front/node_modules/yargs/index.cjs',
    '/Users/tawachan/Documents/Codes/parthenon-front/node_modules/@graphql-codegen/cli/cjs/config.js',
    '/Users/tawachan/Documents/Codes/parthenon-front/node_modules/@graphql-codegen/cli/cjs/cli.js',
    '/Users/tawachan/Documents/Codes/parthenon-front/node_modules/@graphql-codegen/cli/cjs/bin.js'
  ]
}

Node.js v18.17.1

根本解決ではないけど、Storybookがstring-widthに依存していて、それが悪さしているということだった。

Using codegen.ts in an ESM pro...

Describe the bug I don't know if it's a bug or not...

github.com

まだStorybookは運用していない、新規の趣味プロジェクトだったので、いったんStorybookを削除して対応した。根本解決はどうすればいいのかは、Storybookを入れる段になったときにまた考える。