Search code examples
reactjscreate-react-app

Updating to create-react-app v4 , not rendering images

I just updated to create-react-app v4

So my updated dependencies looks as follows

"react": "^17.0.1",
"react-dom": "^17.0.1",
"react-scripts": "4.0.0",

I have deleted all my node_modules folder and reinstalled them again

I have included all my images in an images folder which is present in src folder of create-react-app. When i go back to react-scripts 3.4.4, my images are rendering properly but in v4.0.0 images are not rendered at all. I am using both png and svg in my app and both fail to render.

Edit: I have found that images in public folder seems to render without any issue. But i want the images used by my components in src folder which are still not rendering and placing images used by components in src folder is a good practice. Do I store Image assets in public or src in reactJS?

Solution

  • Try updating require to import statement.

    const myImg = require('../imagepath.jpg')

    to

    import myImg from '../imagepath.jpg'