nextjs 开发的前端 next dev 没问题，但是 next build 怎么也过不了，报错很奇怪

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

这是一个创建于 547 天前的主题，其中的信息可能已经有所发展或是发生改变。

Failed to compile.

./pages/index.tsx:120:37
Type error: Property 'rev' is missing in type '{}' but required in type 'Pick<AntdIconProps, "default" | "id" | "data" | "title" | "colSpan" | "rowSpan" | "width" | "key" | "className" | "children" | "href" | "as" | "onMouseEnter" | "onTouchStart" | ... 349 more ... | "twoToneColor">'.

118 | }}
119 | >
> 120 | <Menu.Item key="0" icon={<HomeOutlined />}>
| ^
121 | 首页
122 | </Menu.Item>
123 | <Menu.Item key="1" icon={<SearchOutlined />}>
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
error Command failed with exit code 1.

<Menu
theme="dark"
mode="inline"
defaultSelectedKeys={["0"]}
onClick={({ key }) => {
setShowHome(key === "" || key === "0");
setShowabc(key === "2");
setShowabcd(key === "3");
setShowSearch(key === "1");
setShowabcde(key === "4");
setShowAwsblogcn(key === "5");
}}
items={[
{
key: "0",

icon: <HomeOutlined />,
label: "首页",
},
{
key: "1",
icon: <SearchOutlined />,
label: "搜索",
},
{
key: "2",
icon: <AppleOutlined />,
label: "abc",
},
{
key: "3",
icon: <TwitterOutlined />,
label: "abc",
},
{
key: "4",
icon: <AppleOutlined />,
label: "abc",
},
{
key: "5",
icon: <TwitterOutlined />,
label: "abc",
},
]}
></Menu>

key

icon

Label

5 条回复 • 2023-05-25 22:21:08 +08:00

hhhanako

2023-05-24 23:33:07 +08:00

dev 的时候不会对 typescript 检查，但是 build 的时候默认会。
你可以 1. 关闭 build 的时候对 tsc 检查，tsconfig 配置一下，但是不推荐
2.根据报错改好代码，看起来你似乎把 rev 打错了？全局搜索一下

leokun

2023-05-25 11:45:13 +08:00

HomeOutlined 组件不符合 icon 的签名吧

xinmans

2023-05-25 20:23:46 +08:00 via iPhone

@leokun
@leokun import 了，antd 的标准 icon 组件，怎会不符合规范呢

import {
HomeOutlined,
AppleOutlined,
TwitterOutlined,
SearchOutlined,
CloudOutlined,
CloudServerOutlined,
MenuFoldOutlined,
MenuUnfoldOutlined,
} from "@ant-design/icons";

xinmans

2023-05-25 20:29:39 +08:00 via iPhone

@hhhanako noEmit：ture 已经设置了，但还是报奇怪的错误

xinmans

2023-05-25 22:21:08 +08:00 via iPhone

Fix by ChatGPT

这个错误显示，您在菜单项中使用了 AntdIcon 组件，但未传递必需的 "rev" 属性。AntdIconProps 接口规定了必须设置 rev 属性的对象。

要解决此问题，请确保将包含 "rev" 属性的对象传递给所有 AntdIcon 组件，并且已正确导入和声明所有类型。如果需要，您可以通过添加可选的 "rev" 属性来解决此特定错误：

```typescript
<Menu.Item key="0" icon={<AntdIcon type="home" style={{ fontSize: 16 }} rev={true} />}>
首页
</Menu.Item>
<Menu.Item key="1" icon={<AntdIcon type="search" style={{ fontSize: 16 }} rev={true} />}>
搜索
</Menu.Item>
<Menu.Item key="2" icon={<AntdIcon type="apple" style={{ fontSize: 16 }} rev={true} />}>
xx
</Menu.Item>
<Menu.Item key="3" icon={<AntdIcon type="twitter" style={{ fontSize: 16 }} rev={true} />}>
xx
</Menu.Item>
<Menu.Item key="4" icon={<AntdIcon type="cloud" style={{ fontSize: 16 }} rev={true} />}>
awsblog
</Menu.Item>
<Menu.Item key="5" icon={<AntdIcon type="cloud-server" style={{ fontSize: 16 }} rev={true} />}>
awsblogcn
</Menu.Item>
```

请注意，AntdIcon 组件的 type 属性接受字符串值，表示您要显示的图标类型。示例代码中使用的图标类型是示例代码中 Ant Design 提供的一些预定义图标类型。