What does this warning message mean? 'img elements must have an alt prop, either with meaningful text, or an empty string for decorative images'

It means when you create an image in your HTML, you should include an alt attribute for the benefit of screen readers and text browsers.

<img src="url" alt="description of image">

Images should have an alt property. The alternate property comes into picture in several cases like the card not getting downloaded, incompatible browsers, or the image getting corrupt. You need to pass in a prop called alt to the image.

Also, Alt tag is used by screen readers for visually impaired. Therefore it is considered as a good practice to always add a ALT tag to the image component. Accessibility


It means that your <img> tag MUST have an alt attribute on it like so:

<img src="pathToYourImage.extension" alt="My Awesome Image">

In case if the image isn't loaded then the text inside the alt attribute will be shown instead.