带有打字稿索引签名的 NextJS 构建错误

问题描述 投票:0回答:1

当我执行 pnpm run build 时,出现此错误:

✓ 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.

我的组件 page.tsx 看起来像这样并且运行良好:

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

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

我的tsconfig是这样的:

{   "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"   ] } 

如果我转到 .next 文件夹“/src/app/components/button/addNew/page.ts”,则此行出现错误

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

我尝试删除打字稿缓存,重新安装node_modules,删除.next文件夹,将界面移动到另一个文件然后导入,我也尝试使用type any。

typescript lint tsconfig pnpm nextjs14
1个回答
0
投票

已解决:我只是为每个组件使用 page.tsx ,下一步是将其添加到应用程序路由器中,我将 src/app/components/addNew/page.tsx 等组件重命名为 src/app/components/addNew/ addNew.tsx 解决了问题

© www.soinside.com 2019 - 2024. All rights reserved.