[nuxt3] Static image generation still results in 404 after latest update for certain images only
See original GitHub issueFor some reason images in certain routes are not pre-rendered but not others. This is after #614.
I have found that Nuxt Images with width and height set do not get rendered statically. E.g. <nuxt-img format="avif" class="img-fluid" width="1920" height="1000" :src="imgPath" alt=""></nuxt-img> does not, but <nuxt-img format="avif" class="img-fluid" :src="imgPath" alt=""></nuxt-img> does.
Issue Analytics
- State:
- Created 10 months ago
- Comments:5
Top Results From Across the Web
Images returning 404 on using local images in Nuxt 3 #638
A remote image URL work btw. Happens only with local static images. Build command was set to yarn generate.
Read more >How to get Nuxt-img to work on nuxt3 generate?
Images work during dev, but get a 404 when using nuxt generate. in my nuxt config i have modules: ["@nuxt/image-edge"], image: { dir:...
Read more >nuxt-img
Converts src to provider optimized URLs; Automatically resizes images based on width and height; Generates responsive sizes when providing sizes option ...
Read more >Server-side rendering with Vue and Nuxt.js - LogRocket Blog
Learn about server-side rendering (SSR) and client-side rendering (CSR), how its evolved, and how to use implement it with Nuxt.js and Vue.
Read more >Creating Server-side Rendered Vue.js Apps Using Nuxt.js
However, Nuxt offers Vue-specific features to create a powerful yet ... nuxt generate ) for creating static generated Vue applications using the same ......
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
On my end, it doesn’t work at all, no static image is built. Am I missing something? EDIT:
nuxt-imgworks if I don’t set thediroption and use the defaultpublicdirectory, the documentation specifically says that I should “deploy customizeddir”, but I don’t know how to do that. Butnuxt-picturestill doesn’t workMy env:
node v18.12.1macOS 13.0.1 (22A400)nuxt@3.0.0@nuxt/image-edge@1.0.0-27827328.bc9ddc0I use as well (normally unrelated):
@nuxt/content@2.2.2nuxt-icon@0.1.8@nuxtjs/tailwindcss@6.1.3along with@tailwindcss/line-clamp@0.4.2sass@1.56.1My
@nuxt/image-edgeconfig is as follows:I use
nuxt-pictureornuxt-imglike this:<nuxt-img src="image-name.png"/>or<nuxt-picture src="image-name.png" />And they are rendered as:
and
But in my
.output/publicthere is no_ipx/directory.By the way, I get the following error during prerender:
I don’t know if that’s expected.
@jamesxu123 Does this only happen when multiple formatters are applied (e.g. width, height, quality, etc)?
If so just made #673 to hopefully solve this issue. And #674 possibly for the second one.