Chakra UI 图像组件无法识别图像路径

时间:2021-07-11 20:25:42

标签: reactjs next.js chakra-ui

我目前正在学习如何使用 ChakraUI

尝试使用加载本地图像时 import { Box, Heading, Text, Image } from "@chakra-ui/react"; 他们根本不显示,只是替代文本,就好像他们的路径没有正确输入一样,我还尝试将图像源直接输入到组件中。

nextjs/image 组件在 完全相同的 src 路径下正常工作,但我没有关于此特定错误的任何信息,我还尝试了 {{1 }} 组件和 @chakra-ui/image 作为我也使用 Nextjs 工作,这些脉轮选项都不适合我。

import { Img } from "@chakra-ui/react";

在 ChakraUI 文档中,它从未使用本地路径作为示例,但我认为这不会有问题

1 个答案:

答案 0 :(得分:0)

我遇到了类似的问题,但就我而言,我没有使用导入。像上面一样使用 import 后,它工作正常。

既然您正在使用 Next.js,我建议您从 Img 导入并使用 Chakra @chakra-ui/react 组件并改用它。此提示来自此 Chakra UI author

上的 thread