Adding Nuxt Image to Our Project

The Nuxt image module is created and maintained by the core Nuxt team. This module is available to optimize our images, including transforms, resizing, and responsive sizes. It can also integrate with providers such as Cloudinary, Contentful, Sanity, and Cloudflare and optimize the provided images.

Using the <nuxt-img /> component

This is all that is required to now use it in our pages or components. Using our index.vue file, we can replace the existing <img> element: