Do I store Image assets in public or src in reactJS?

Question

I am using react for my application. I have a div that I would like to have a background image. But I can't get it to show.

When I include it in the src folder as myapp/src/bgimage.png it works perfectly but I've heard that I should include it in a folder named images at the root level so it's myapp/images/bgimage.png, however this does not work for me and gives me:

You attempted to import ../images/bgimage.png which falls outside of the project src/ directory.'

Can anyone tell me the proper way to include image assets in reactJS?

Answer 1

public: anything that is not used by your app when it compiles

src: anything that is used when the app is compiled

So for example if you use an image inside a component, it should be in the src folder but if you have an image outside the app (i.e. favicon) it should be in public.