Nuxt3项目中NuxtImg组件返回404错误的求助

问题根源 #

你给NuxtImg指定的_nuxt/assets/img/my-image.jpg路径是错误的。NuxtImage依赖的IPX服务处理本地静态资源时，不需要添加_nuxt前缀——这个前缀是Nuxt构建完成后资源的部署路径，但开发阶段NuxtImg会直接读取项目源码里的assets目录，而非构建后的路径。

修复方案 #

将NuxtImg的src改为指向源码中assets目录的相对路径即可：

<NuxtImg src="~/assets/img/my-image.jpg" />

或者使用更简洁的写法（Nuxt会自动解析assets的别名）：

<NuxtImg src="/assets/img/my-image.jpg" />

补充说明 #

• 原生<img>能加载_nuxt/...路径，是因为它直接请求构建后的资源位置；但NuxtImg是通过IPX服务对资源做处理（比如压缩、裁剪），必须指向源码里的原始资源路径。
• 修改后IPX会正确定位到assets/img/my-image.jpg，生成的请求路径会变成类似http://localhost:3000/_ipx/w_600/assets/img/my-image.jpg（会根据你的配置自动添加处理参数），不再返回404错误。

内容的提问来源于stack exchange，提问作者americanknight