Nuxt Image 2.0.0: image.dir does not work with IPX, but undocumented image.ipx.dir does (TS types reject it)
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 1.5k
- Forks
- 331
- Avg merge
- 19h 52m
- Merged PRs (30d)
- 9
Description
Environment
- Nuxt: 4.4.8
- @nuxt/image: 2.0.0
- Package manager: pnpm
- OS: Windows 11
Reproduction
Project structure:
public/
└── logo.png
Component:
<NuxtImg
src="/logo.png"
alt="Logo"
width="20"
height="20"
/>
The static file is accessible:
http://localhost:3000/logo.png
However, the generated IPX URL fails:
http://localhost:3000/_ipx/s_40x40/logo.png
with:
{
"error": {
"message": "[404] [IPX_FILE_NOT_FOUND] File not found: /logo.png"
}
}
Configuration that does NOT work
image: {
provider: 'ipx',
dir: 'public'
}
This still produces:
[IPX_FILE_NOT_FOUND] File not found: /logo.png
Configuration that DOES work
image: {
provider: 'ipx',
ipx: {
dir: 'public'
}
}
After using the above config, IPX correctly resolves files from public/.
TypeScript issue
The working configuration produces a TS error:
Object literal may only specify known properties,
and 'dir' does not exist in type 'Partial<IPXOptions>'.
Example:
image: {
provider: 'ipx',
ipx: {
dir: 'public'
}
}
Expected behavior
Either:
image.dirshould work as documented for IPX, orimage.ipx.dirshould be documented and typed correctly.
Actual behavior
image.dirdoes not appear to affect IPX file resolution.image.ipx.dirfixes the issue at runtime.- TypeScript rejects
image.ipx.dir.
Additional notes
This appears to be a mismatch between runtime behavior and TypeScript definitions. Runtime is reading image.ipx.dir, but the exposed IPXOptions type does not include dir.
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the Nuxt image configuration, the IPX provider's dir handling, and the exposed IPXOptions type, using the supplied public/logo.png reproduction. Compare image.dir with image.ipx.dir at runtime and in TypeScript; done means the documented configuration works or the nested option is documented and accepted by the type.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- nuxt, typescript
- Domain
- performance, web-dev
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Quiet
- Clarity
- Mostly clear
- Newbie friendliness
- 55/100