[Solved]-cant add image in react getting an error Error: Cannot find module './undefined' when using require-Reactjs

if you are building something like blog or Ecomm site you are storing img in a folder.

my img is inside upload/pic.png upload is my folder where I am storing img

Transfer your img folder or img to Public folder

access

img in .js FILE

<img src={ process.env.PUBLIC_URL`/uploads/pic.png} />
<img src={ process.env.PUBLIC_URL`/uploads/${this.props.data.postImage}`} />

img in .HTML

<img src = '%PUBLIC_URL%pic.png'/>

read about file processed by

webPack

I've seen this exact error in an image src require. It's thrown when the pass-in is undefined, which in your case is book.cover. Essentially it wants to set the source as an undefined link. That ./ is implied.

Consider conditional rendering with a typeof check to ensure that the image tag does not load if the cover does not exist.

if (typeof(book.cover) !== 'undefined') {
  return ( <img src={require(`../images/${book.cover}`)} /> );
} else {
// error handling here
...
}