Next.js 13 + TypeScript构建报错：如何让TS忽略node_modules？

我使用Next.js 13、TypeScript、src目录及app目录搭建网站，执行npm run dev时一切正常，但执行next build构建操作时出现如下类型错误：

./node_modules/next-auth/src/core/lib/assert.ts:134:27
Type error: Element implicitly has an 'any' type because expression of type 'string' can't be used to index type 'Adapter'.
  No index signature with a parameter of type 'string' was found on type 'Adapter'.

  132 |       "useVerificationToken",
  133 |       "getUserByEmail",
> 134 |     ].filter((method) => !adapter[method])
      |                           ^

我已在tsconfig.json中配置"skipLibCheck": true，并在exclude字段添加node_modules相关路径，但问题仍未解决。以下是相关配置及代码：

相关配置文件 #

tsconfig.json #

{
  "compilerOptions": {
    "target": "es5",
    "lib": ["dom", "dom.iterable", "esnext"],
    "allowJs": true,
    "skipLibCheck": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "noEmit": true,
    "esModuleInterop": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "jsx": "preserve",
    "incremental": true,
    "plugins": [
      {
        "name": "next"
      }
    ],
    "baseUrl": ".",
    "paths": {
      "@/*": ["./src/**/*"]
    },
    "types": [],
  },
  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
  "exclude": [
    "node_modules",
    "./node_modules",
    "./node_modules/*",
    "./node_modules/@types/node/index.d.ts"
  ]
}

package.json #

{
  "name": "next13-app",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "lint": "next lint"
  },
  "dependencies": {
    "@motionone/utils": "^10.15.1",
    "@next-auth/prisma-adapter": "^1.0.6",
    "@prisma/client": "^4.14.0",
    "@sendgrid/mail": "^7.7.0",
    "@tailwindcss/forms": "^0.5.3",
    "@types/node": "20.1.3",
    "@types/react": "18.2.6",
    "@types/react-dom": "18.2.4",
    "autoprefixer": "10.4.14",
    "clsx": "^1.2.1",
    "framer-motion": "^10.12.10",
    "next": "13.4.2",
    "next-auth": "^4.22.1",
    "postcss": "8.4.23",
    "react": "18.2.0",
    "react-dom": "18.2.0",
    "react-intersection-observer": "^9.4.3",
    "react-markdown": "^8.0.7",
    "tailwindcss": "3.3.2",
    "typescript": "5.0.4"
  },
  "devDependencies": {
    "@types/cookie": "^0.5.1",
    "prisma": "^4.14.0"
  }
}

auth/[...nextauth]/route.ts #

import {prisma} from '../../../../lib/prisma'
import {PrismaAdapter} from "@next-auth/prisma-adapter";
import NextAuth from 'next-auth'
import type {NextAuthOptions} from 'next-auth'
import GithubProvider from 'next-auth/providers/github'

export const authOptions: NextAuthOptions = {
    adapter: PrismaAdapter(prisma),
    secret: process.env.NEXTAUTH_SECRET,
    providers: [
        GithubProvider({
            clientId: process.env.GITHUB_ID!,
            clientSecret: process.env.GITHUB_SECRET!,
        }),
    ],
    callbacks: {
        session: async ({ session, token }) => {
            if (session?.user) {
                // @ts-ignore
                session.user.id = token.uid!;
            }
            return session;
        },
        jwt: async ({ user, token }) => {
            if (user) {
                token.uid = user.id!;
            }
            return token;
        },
    },
    session: {
        strategy: 'jwt',
    },
};
const handler = NextAuth(authOptions);
export {
    handler as GET,
    handler as POST,
}

解决方案 #

这个问题是NextAuth v4.22.1与TypeScript 5.x版本不兼容导致的类型检查冲突，即使配置skipLibCheck也无法完全绕过Next.js构建时的依赖类型校验。可以通过以下方式解决：

方法1：升级NextAuth到兼容版本 #

NextAuth v4.23.0及以上版本已修复TypeScript 5.x的兼容问题，修改package.json中的版本号后执行npm install：

"next-auth": "^4.23.0"

方法2：降级TypeScript版本 #

将TypeScript降级到4.9.x版本（NextAuth v4对该版本兼容性更好），修改package.json：

"typescript": "~4.9.5"

执行npm install重新安装依赖。

方法3：临时关闭严格类型检查（不推荐长期使用） #

在tsconfig.json中关闭noImplicitAny或直接禁用strict模式：

"compilerOptions": {
  // ...其他配置
  "strict": false,
  // 或单独关闭："noImplicitAny": false
}

方法4：添加类型断言绕过检查 #

在auth配置文件中给adapter添加类型断言，导入Adapter类型后修改配置：

import type { Adapter } from "next-auth/adapters";

// ...其他代码
export const authOptions: NextAuthOptions = {
    adapter: PrismaAdapter(prisma) as unknown as Adapter,
    // ...其他配置
};

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