Generate static images used in modals.
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 1.5k
- Forks
- 331
- Avg merge
- 19h 52m
- Merged PRs (30d)
- 9
Description
My blog-type test project uses the content and image modules to create pages from markdown. I finally got fully static built-in IPX image generation to work, and two variants of my source images are being generated in dist/_nuxt/images. To display the images, I use $img inside my own component, which also allow the reader to click an image and get a large size third version (2000px) of the image in a modal dialog.
My problem is that images in the modal code are not crawled/processed, and no large-width image variants are generated. I tried adding a dummy with display:none to pull in large-version images into the generating process (which works), but that also causes the browser to always fetch all large-sized images as soon as the page loads.
Is there a way to have 'nuxt generate' create my large-width images, which are only fetched if the user clicks a much smaller thumbnail type image?
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 by tracing the static image generation and crawling entry points in the Nuxt image module, then reproduce the markdown/content project with a thumbnail and a modal-only 2000px image. Done means nuxt generate emits the large image variant without causing the browser to fetch it before the user opens the modal.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- nuxt, typescript
- Domain
- frontend, performance
- Issue type
- Feature
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 30/100