ReactJS import dynamic images into component

Reference :

There are pints about when to store images in public or src folder.

/public

  • Images can not be minified & post-processed when you build an app for production
  • You will not get any errors for missing images at the time of compilation. So, After building an app, the user will get a 404 error
  • Images name will not include content hashes.

when to use ?

  • need to use images with a specific name in the build output. for example — you get the default logo logo192.png
  • need to reference paths of a lot of images dynamically

/src

  • Images are imported using the import keyword like css code
  • Images will be minified & bundled when you build your app using the build command
  • You will definately get errors for missing images at the time of compilation
  • Images name will include content hashes

--

--

--

Love podcasts or audiobooks? Learn on the go with our new app.

Express.js
testing javscript types in the console. typeof true is a boolean, typeof undefined is undefined, type of 6 is a string

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Cheryl Chuang

Cheryl Chuang

More from Medium