Directus

To use this provider you only need to specify the base URL of your Directus instance.

export default defineNuxtConfig({
  image: {
    directus: {
      // This URL needs to include the final `assets/` directory
      baseURL: 'http://localhost:8055/assets'
    }
  }
})

Props

Supported NuxtImg props (such as width, height, quality, format, and fit) map to Directus transforms.

<NuxtImg
  provider="directus"
  src="ad514db1-eb90-4523-8183-46781437e7ee"
  height="512"
  width="200"
  fit="inside"
  quality="20"
/>

Modifiers

The modifiers object is used for Directus-specific features. All modifiers are optional.

Examples of Modifiers

<NuxtImg
  provider="directus"
  :modifiers="{
    withoutEnlargement: true,
    transforms: [['blur', 4], ['negate']]
  }"
/>

<NuxtImg
  provider="directus"
  :modifiers="{
    key: 'system-large-cover'
  }"
/>

All Modifiers