Getting a Vue Error: Cannot find module for image for dynamic image

Question

I looked at Vue cannot find module image location and couldn't figure out a solution.

in my code when I hard code it

:src="require('@/assets/featured/pizzaOne.jpeg')"

I get the image. But when I try

:src="require(`${item.img}`)"

I get Error: Cannot find module '@/assets/featured/pizzaOne.jpeg' Not sure why and how to fix this

Answer 1

If you can change item.img to just name pizzaOne.jpeg, then in method:

methods: {
  getImgUrl: function (img) { 
     return require('@/assets/featured/' + img);
  }
}

end in template:

<img :src="getImgUrl(item.img)" />