如何让GraphQL Codegen生成的TypeScript类型模块全局可访问？

看起来你遇到的问题核心是：你的generatedTypes.ts是一个模块（因为有export {};），里面的类型默认只在模块内部可见，即使tsconfig包含了这个文件夹，其他文件不导入它的话还是无法访问这些类型。下面给你几个实用的解决方法，按推荐程度排序：

方法一：通过全局声明包裹类型（最推荐，无需改文件名） #

这个方法不需要改动文件扩展名，也不用大幅调整tsconfig，只需要修改生成的类型文件和加一行导入：

1. 修改generatedTypes.ts文件：
   把所有的类型定义包裹在declare global块中，保留原来的export {};（这样文件还是合法的模块）：

   export {};
   
   declare global {
     type System = GQLNode & { 
       __typename?: 'System'; 
       createdAt?: Maybe<Scalars['Datetime']['output']>; 
       // 你的其他类型定义...
     };
   
     type SignupMutation = { 
       __typename?: 'Mutation'; 
       registerUser?: { __typename?: 'RegisterUserPayload'; jwtToken?: any | null; } | null; 
     };
     // 所有其他类型都放到这个块里
   }
   

2. 在项目入口导入这个模块：
   找到你项目的入口文件（比如Next.js里的pages/_app.tsx，或者根目录的index.ts），添加一行导入：

   import '../src/generated/generatedTypes.ts';
   

   这样一来，只要这个入口文件被加载，里面的全局类型就会对整个项目生效，你在任何.ts/.tsx文件里直接用System、SignupMutation这些类型都不会报错了。

方法二：转为全局声明文件（适合不想写导入的情况） #

如果你不想在入口文件加导入，可以把类型文件改成TypeScript的声明文件：

1. 重命名文件：把generatedTypes.ts改成generatedTypes.d.ts
2. 移除模块标记：删除文件里的export {};（因为.d.ts文件如果没有export，TypeScript会自动把它当作全局声明文件）
3. 确保tsconfig包含这个文件：你的tsconfig里已经有"src/generated"在include数组里，这一步已经满足，不需要额外修改。
   改完之后，TypeScript会自动扫描这个全局声明文件，里面的所有类型都会直接全局可用。

方法三：通过tsconfig的types或typeRoots配置 #

如果不想修改生成的文件，也可以调整tsconfig.json的编译选项：

1. 启用types字段：在compilerOptions里添加：

   "types": [
     "node",
     "./src/generated/generatedTypes.ts"
   ]
   

   这样TypeScript会自动加载这个文件里的类型，即使你不手动导入。
2. 或者用typeRoots：如果你的src/generated文件夹里有多个类型文件，可以这样配置：

   "typeRoots": [
     "./node_modules/@types",
     "./src/generated"
   ]
   

   注意：typeRoots指定的是存放类型声明的文件夹，TypeScript会优先加载里面的.d.ts文件，所以如果你的文件是.ts格式，可能需要先转成.d.ts才能生效。

为什么原来的配置不生效？ #

你之前在tsconfig里加了"src/generated"到include里，这确实会让TypeScript扫描这个文件夹，但因为generatedTypes.ts是一个模块（有export {};），里面的类型都是模块级别的私有类型，只有导入这个模块的文件才能看到。上面的方法要么把类型提升到全局，要么让TypeScript把模块里的类型当作全局类型加载，这样就能解决Cannot find name SomeType的错误了。

内容来源于stack exchange