Next.js: Image layout prop does not exists in TS
Bug report
(JSX attribute) layout: string
No overload matches this call.
To Reproduce
Just have Next in a project, import next/image and try to use layout prop like so:
<Background src='/img/header.png' quality={100} layout='fill' />
Expected behavior
A working prop that is recognized by the editor.
Screenshots
{
"dependencies": {
"next": "10.0.2-canary.4"
}
}
System information
- OS: Windows
- Version of Next.js: 10.0.2-canary.4
- Version of Node.js: v14.15.0
Additional context
The prop is working but its not recognized by the editor.
Rechdan
All 4 comments
You're example says Background instead of Image. Perhaps you are using the wrong component.
I confirmed that layout="fill" does work correctly with TS and it even offers the suggestion.
Make sure you use import Image from 'next/image' to import the correct component.
styfle
on 11 Nov 2020
@styfle now I believe I found the real problem, when I use the Image Component with styled-components, the layout prop dos not shown up, any idea why?
Rechdan
on 11 Nov 2020
Does it work with the standard import Image from 'next/image' usage?
If so, then it sounds like a bug with styled-components.
styfle
on 11 Nov 2020
It works with the default import, that solves the problem, thanks!
Rechdan
on 12 Nov 2020
Related issues
ghost
·
3Comments
YarivGilad
·
3Comments
knipferrc
·
3Comments
pie6k
·
3Comments
rauchg
·
3Comments
Most helpful comment
Does it work with the standard
import Image from 'next/image'usage?If so, then it sounds like a bug with
styled-components.