Material ui 有没有办法将图像导入我的materialui nextjs项目

我导入的图像如下所示：

从“../public/buildingspattern.png”导入img 然后在组件中使用它：

某物 然后我修复了next.config.js

const webpack=需要“webpack”； module.exports={ i18n：{ 地区：[en，fr]， 默认语言环境：恩， }, 网页包：配置，选项=>{ config.module.rules.push{ 测试：/\.png| jpe？g|gif$/i， 使用：[ { 加载器：“文件加载器”， }, ], } 返回配置 }, }; 我想我错过了一些东西 应用程序启动正常，但图像不在那里

这就是我在我离开后在网页上看到的

---

首先，您可以使用next.js中图像的绝对路径，如/image name，如果不起作用，您将在公共目录中创建一个名为static的目录，并将您的图像放在static目录中，然后您可以访问/static/image name

首先，您可以在next.js中使用图像的绝对路径，如/image name，如果不起作用，您将在公共目录中创建一个名为static的目录，并将图像放在static目录中，然后您可以访问/static/image name

假设您创建了一个用于返回图像的组件

import Image from 'next/image';


function ImageComponent() {
    return (
        <Image src="../public/someImage.png" alt="Buildings Pattern"/>
    );
};

---

✌

假设您创建了一个用于返回图像的组件

import Image from 'next/image';


function ImageComponent() {
    return (
        <Image src="../public/someImage.png" alt="Buildings Pattern"/>
    );
};

---

✌

我今天刚实现时遇到了另一种方法。。 更简单、更高效

转到MaterialUi中的卡组件 用标签替换标准标签 另外，请从“下一个/图像”添加导入图像

---

我今天刚实现时遇到了另一种方法。。 更简单、更高效

转到MaterialUi中的卡组件 用标签替换标准标签 另外，请从“下一个/图像”添加导入图像

---

尝试src prop或将HIGHT设置为CardMedia尝试src prop或将HIGHT设置为CardMedia