Блог

Извините, я удалил свой предыдущий пост, потому что имя и имя изображения при импорте отличались. Я исправил проблему, но я все еще получаю

 ModuleNotFoundError: Module not found: Error: Can't resolve '../../public/assets/images/banner/bannerimg2.png' in '/vercel/1aa39631/containers/banner'


import React from 'react';
import { Container, Row, Col } from 'reactstrap';
import {Button} from '../../components/common/button';
import { Titlespan, Description } from '../../components/common/title/index';
import Image from '../../components/common/image/index';
import BannerImg1 from '../../public/assets/images/banner/bannerimg2.png';
import BannerBackgroundImages from '../../data/bannerimages';
import Shape2 from '../../public/assets/images/banner/bg-wave.svg';
import Shape3 from '../../public/assets/images/banner/wave.png';
import './banner.scss';
  

Папка public (остается в корне проекта) — это специальная папка для хранения статических файлов (изображений, css, шрифтов)

Вы можете встроить эти статические файлы из общей папки в общие элементы: <img src=... , <link href=...

Например

 public
  static
    images
      logo.png
    css
      custom.css

// In your components, remove the "public", use the child path
<img src="/static/images/logo.png />
<link href="/static/css/custom.css />
  

Смотрите https://nextjs.org/docs/basic-features/static-file-serving для получения более подробной информации

В вашем случае вы хотите импортировать файлы SVG, давайте переместим их в другую папку, отличную от этой public папки, и изменим старые пути импорта