Johannes
Johannes

Reputation: 60

NextJS: Image warning error "Please make sure it has an appropriate `as` value and it is preloaded intentionally."

Got this error message on the console

The resource "xxx.svg" was preloaded using link preload but not used within a few seconds from the window's load event. Please make sure it has an appropriate as value and it is preloaded intentionally.enter image description here

And here is my code

import Image from 'next/image'

<Image src={xxx} width={32} height={24} priority />

Here is my code

I expect to do the correct next image rendering with Priority attribute without the warning message.

Upvotes: 0

Views: 1679

Answers (1)

Travis Pulley
Travis Pulley

Reputation: 11

I ran into this because I had a default image in the largest contentful paint, but when it needed to look up an image it gave me this warning if I used the priority attribute. So I simply enabled priority only for the default attribute and that solved it for me. Something like this:

<Image
  priority={use_default ? true : false}
  ...
/>

Upvotes: 1

Related Questions