Skip to content
Get help on SlackWatch Sanity demo

Localising image fields in Sanity and resolving the "Encountered anonymous inline image" error.

5 replies
Last updated: Apr 3, 2020
Hi, I’m trying to localise an image field.
The code below looks to work fine in Studio, but 
sanity graphql deploy
gives the following error:

Error: Encountered anonymous inline image "en" for field/type "LocaleImage". To use this field with GraphQL you will need to create a top-level schema type for it.

Here’s the code in question (follows
https://www.sanity.io/docs/localization and https://www.sanity.io/docs/image-type ):

import supportedLanguages from './supportedLanguages';

export default {
  name: 'localeImage',
  type: 'object',
  title: 'Locale Image',
  fieldsets: [
    {
      title: 'Translations',
      name: 'translations',
      options: { collapsible: true }
    }
  ],
  fields: supportedLanguages.map(lang => ({
    name: lang.id,
    type: 'image',
    title: lang.title,
    fields: [
      {
        name: 'alt',
        type: 'string',
        title: 'Title / Alt Text',
        options: {
          isHighlighted: true
        }
      }
    ],
    fieldset: lang.isDefault ? null : 'translations'
  }))
};
I’m puzzled as to which way this needs to be resolved. Please note that the localised image works fine until I add 
fields
under 
type: 'image'
.
Apr 3, 2020, 8:07 PM
actually just running into this myself...
you need to make the image its own item. and then include it as that type.

one sec and i'll post an example
Apr 3, 2020, 8:10 PM
here's my image item/object (call it what you want)

export default {
  title: "Image",
  name: "inlineImage",
  type: "image",
  preview: {
    select: {
      title: "caption",
      media: "image"
    }
  },
  fields: [
    {
      title: "Alt",
      name: "alt",
      type: "string",
      options: {
        isHighlighted: true
      }
    },
    {
      title: "Caption",
      name: "caption",
      type: "string",
      options: {
        isHighlighted: true
      }
    }
  ]
};
Apr 3, 2020, 8:11 PM
then in another place, either 
object
or 
document
or whatever, you can include it as follow:

{
      title: "Custom Thumbnail",
      name: "thumbnail",
      type: "inlineImage",
    },
Apr 3, 2020, 8:11 PM
you'll have to go through every place that you were using an inline image that also had fields (ie: alt text or caption or whatever)
that's what i'm in the middle of right now... going through like 20 
documents
and 20 
objects
to replace inline images with my custom 
object
Apr 3, 2020, 8:13 PM
Thanks
user N
! Got it going. Much appreciated! 💯🙏
Apr 3, 2020, 8:23 PM

Sanity– build remarkable experiences at scale

The Sanity Composable Content Cloud is the headless CMS that treats content as data to power your digital business. Free to get started, and pay-as-you-go on all plans.

Get startedWatch demo

Was this answer helpful?

Categorized in