Build & preview works fine (optimized images) locally, but not on netlify
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 1.5k
- Forks
- 331
- Avg merge
- 19h 52m
- Merged PRs (30d)
- 9
Description
When I build & preview my app locally, the optimized images (unsplash) are loading just fine.
But when deployed to netlify, they images are missing. I'm not sure if this is a bug (or) if I'm missing any config (plz correct me if so). Thanks for looking into this.
Here is my repo - https://github.com/TechAkayy/happy-paws-with-nuxt-tailwindcss
Prod - https://legendary-melomakarona-0f405b.netlify.app/
Dependencies Info
Run npx nuxi info and pnpm list (or npm list) and provide the output:
- Operating System: `Darwin`
- Node Version: `v18.12.1`
- Nuxt Version: `3.6.5`
- Nitro Version: `2.5.2`
- Package Manager: `npm@8.19.2`
- Builder: `vite`
- User Config: `runtimeConfig`, `modules`, `pinegrow`, `css`, `postcss`, `image`, `content`, `unocss`, `pinia`, `imports`
- Runtime Modules: `@pinegrow/nuxt-module@3.0.19`, `@unocss/nuxt@0.54.3`, `@nuxt/content@2.8.2`, `@vueuse/nuxt@10.3.0`, `@pinia/nuxt@0.4.11`, `@nuxtjs/html-validator@1.5.2`, `@nuxt/image@1.0.0-rc.2`
- Build Modules: `-`
happy-paws-with-nuxt-tailwindcss@0.0.0 /Users/techakayy/Templates/happy-paws-with-nuxt-tailwindcss
├── @iconify/json@2.2.102
├── @nuxt/content@2.8.2
├── @nuxt/devtools@0.7.6
├── @nuxt/eslint-config@0.1.1
├── @nuxt/image@1.0.0-rc.2
├── @nuxtjs/html-validator@1.5.2
├── @pinegrow/nuxt-module@3.0.19
├── @pinegrow/tailwindcss-plugin@3.0.17
├── @pinia/nuxt@0.4.11
├── @tailwindcss/forms@0.5.4
├── @tailwindcss/typography@0.5.9
├── @types/node@20.5.0
├── @unocss/nuxt@0.54.3
├── @unocss/preset-icons@0.54.3
├── @vue/devtools@6.5.0
├── @vueuse/core@10.3.0
├── @vueuse/nuxt@10.3.0
├── autoprefixer@10.4.15
├── eslint-config-prettier@8.10.0
├── eslint@8.47.0
├── npm-run-all@4.1.5
├── nuxt@3.6.5
├── pinia@2.1.6
├── postcss@8.4.28
├── prettier@2.8.8
├── rehype-external-links@2.1.0
├── tailwindcss@3.3.3
└── typescript@5.1.6
Local: npm run now (build & preview)
Production (on netlify)
Here is my netlify deploy config
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 reproducing the linked happy-paws-with-nuxt-tailwindcss deployment with the listed Nuxt, @nuxt/image, and Netlify configuration. Compare optimized image requests in local build-and-preview with production, then confirm the cause and document a configuration or deployment change that makes the images load on Netlify.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- nuxtjs, tailwindcss
- Domain
- cloud, performance, web-dev
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Needs clarification
- Newbie friendliness
- 28/100