NextJS+TypeScript构建报错：OmitWithTag类型不满足索引签名约束

构建错误信息 #

执行pnpm run build时触发TypeScript类型检查失败，错误详情如下：

✓ Compiled successfullyLinting and checking validity of types  ..Failed to compile. .next/types/app/components/button/addNew/page.ts:

Type error: Type 'OmitWithTag<ButtonProps, keyof PageProps, "default">' does not satisfy the constraint '{ [x: string]: never; }'.Property 'onClick' is incompatible with index signature.Type 'MouseEventHandler<HTMLButtonElement>' is not assignable to type 'never'.

// Check the prop type of the entry function
28 | checkFields<Diff<PageProps, FirstArg<TEntry['default']>, 'default'>>()|             ^29 |30 | // Check the arguments and return type of the generateMetadata function31 | if ('generateMetadata' in entry) { ELIFECYCLE  Command failed with exit code 1.

错误代码位于.next/src/app/components/button/addNew/page.ts的第28行：

// Check the prop type of the entry function 
checkFields<Diff<PageProps, FirstArg<TEntry['default']>, 'default'>>()

组件代码（可正常运行，但构建报错） #

路径：src/app/components/button/addNew/page.tsx

interface ButtonProps {
  onClick: React.MouseEventHandler<HTMLButtonElement>;
}

export default function NewTaskButton({ onClick }: ButtonProps) {
  return (
    <div>
      <button className="btn btn-accent btn-circle font-extrabold text-xl w-15 h-15" onClick={onClick}>+</button>
    </div>
  );
}

tsconfig.json 配置 #

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

已尝试的无效解决方法 #

• 清除TypeScript缓存
• 重装node_modules
• 删除.next文件夹
• 将ButtonProps接口移至外部文件导入
• 用any类型替代ButtonProps

求可行的排查与解决思路。

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