Estoy usando Next.js y recibí este error. Este es el código:
import React from "react"; import { Container, Col, Row } from "react-bootstrap"; import Image from "next/image"; export default function fs() { return ( <div> <Container> <Row> <Col lg="4" md="4"> <Row>test</Row> <Row>test</Row> <Row>test</Row> </Col> <Col lg="4" md="4"> <Image width="100%" height="50" src="/images/crown.png" /> </Col> <Col lg="4" md="4"> </Col> </Row> </Container> </div> ); }y después de revisar el código muchas veces, descubrí que la carpeta de imágenes no puede existir en la carpeta 'estilos', debería estar en la carpeta 'pública' (¡aparentemente así es como funciona la arquitectura Next.js!).
de acuerdo con la arquitectura de Next.js, debe haber una carpeta llamada 'pública'. Debe colocar las imágenes utilizadas en la aplicación allí, y no en ninguna otra carpeta como 'estilos'.