Next.js Discord

Discord Forum

Bug with <Image /> from lucide-react -> eslint warning.

Answered
Odorous house ant posted this in #help-forum
Open in Discord
Odorous house antOP
Hey! I'm using Lucide react for my app icons, and when I use <Image /> icon (from lucide, not next/image), I get warning:

17:23 Warning: Image elements must have an alt prop, either with meaningful text, or an empty string for decorative images. jsx-a11y/alt-text

But this is not an image, its just that it has the same name xd
Answered by joulev
eslint simply checks for all components named "Image". You can either import ImageIcon instead (lucide-react exports that) or just put a eslint-disable-next-line comment there
View full answer

8 Replies

@B33fb0n3 Can you share how you import the „Image“?
Odorous house antOP
As any other Icon from lucide
Note that I get the warning on console when doing next build
But if I'm not wrong, I think I also got the error inline before, but not anymore and not really sure right now
B33fb0n3
And when you take a look at the html rendered inside your browser there is an „a“-Tag or an svg?
@B33fb0n3 And when you take a look at the html rendered inside your browser there is an „a“-Tag or an svg?
Odorous house antOP
Got the warning in line today too, and this is what is rendered on page. It is actually an svg, only thing is that it is inside a <button> but that should still not make this throw the warning, shouldn't it? 😂
Answer