运行graphql-codegen-esm报错：loadTs is not a function

常见原因及排查步骤 #

1. GraphQL Code Generator版本不兼容 #

loadTs相关错误大多和代码生成器核心包、插件的版本不匹配有关，尤其是ESM模式下的版本适配问题：

• 检查package.json中@graphql-codegen/cli、@graphql-codegen/typescript等所有codegen相关包的版本，确保版本统一，避免混合使用v2和v3这类跨大版本的包。
• 尝试重新安装依赖：删除node_modules和package-lock.json/yarn.lock，再执行npm install或yarn install。

2. ESM配置冲突 #

使用graphql-codegen-esm需要保证项目ESM配置逻辑正确：

• 若package.json中有"type": "module"字段，确认tsconfig.json的compilerOptions.module设为ESNext/ES2020及以上，moduleResolution设为NodeNext或Node16。
• 若项目是CommonJS模式（无"type": "module"），但使用了ESM版codegen，可能引发加载错误，可尝试改用graphql-codegen（CommonJS版），或调整项目模块类型。

3. codegen.yml配置问题 #

配置文件的插件、加载器设置可能触发错误的TS加载逻辑：

• 检查codegen.yml中是否有自定义TS加载配置（比如loader字段），确保没有错误引用loadTs相关函数。
• 先简化配置，用最基础的配置测试（比如只生成Typescript类型），确认是否还会报错，再逐步添加其他插件排查问题。

4. Node版本适配问题 #

虽然v18.7.0属于较新版本，但部分codegen版本对Node的ESM处理有特定要求：

• 尝试升级Node到v18稳定版（比如v18.17.0），早期v18版本可能存在ESM相关bug。
• 检查执行命令时是否使用了--experimental-specifier-resolution=node这类实验性参数，这类参数可能干扰codegen的模块加载逻辑。

5. TS配置文件冲突 #

tsconfig.json的部分设置可能影响codegen的TS加载逻辑：

• 确保tsconfig.json的include/exclude没有排除codegen需要处理的文件，compilerOptions中的target、lib等字段设置合理。
• 在codegen.yml中通过tsConfigPath字段明确指定tsconfig.json路径，避免自动加载错误的配置文件。

内容的提问来源于stack exchange，提问作者Roman Mahotskyi