DEV Community

Discussion on: Minify, generate WebP and lazyload images in your Vue & Nuxt application

granttransition profile image
Grant Smith


This looks great. I am either misunderstanding (highly likely), or I've made a mistake (even more likely). After implementation of the above, I no longer see images whilst on Dev. This will be because I have changed all my src attributes to data-src. Is this the expected behaviour?

ignore_you profile image
Alex Author

Hello! At first, are there any console errors or warnings? Did you implement webpack settings, so when you look into source code, you see correct path to images?

leonbuchner profile image
Leon Buchner • Edited on

I have the same error.
I have no images anymore...

Image Code:
<img data-src="~/assets/chat-icon.svg" alt="" class="chat-icon mr-2 lazyload">

Error in Browser Console:
GET localhost:3000/~/assets/chat-icon.svg 404 (Not Found)

Thread Thread
moeses profile image

getting a blank 1x1 image aswell