Sanity CMS defineType 'fields' and 'of' types mismatch

Question

I'm trying to make a blog using Sanity CMS, and I believe I generated some schema types using the Sanity CLI and selected the blog option. However, TypeScript seems to be warning me about some of these types.

This is my author.ts file:

import { defineField, defineType } from 'sanity';

export default defineType({
  name: 'author',
  title: 'Author',
  type: 'document',
  fields: [
    defineField({
      name: 'name',
      title: 'Name',
      type: 'string',
    }),
    defineField({
      name: 'slug',
      title: 'Slug',
      type: 'slug',
      options: {
        source: 'name',
        maxLength: 96,
      },
    }),
    defineField({
      name: 'image',
      title: 'Image',
      type: 'image',
      options: {
        hotspot: true,
      },
      fields: [
        {
          name: 'alt',
          type: 'string',
          title: 'Alternative Text',
        },
      ],
    }),
    defineField({
      name: 'bio',
      title: 'Bio',
      type: 'array',
      of: [
        {
          title: 'Block',
          type: 'block',
          styles: [{ title: 'Normal', value: 'normal' }],
          lists: [],
        },
      ],
    }),
  ],
  preview: {
    select: {
      title: 'name',
      media: 'image',
    },
  },
});

Which gives me 2 errors, one on fields for the image field:

Argument of type '{ name: string; title: string; type: string; options: { hotspot: boolean; }; fields: { name: string; type: string; title: string; }[]; }' is not assignable to parameter of type '{ type: string; name: string; } & TypeAliasDefinition<string, "string" | "number" | "boolean" | "object" | "document" | "url" | "array" | "block" | "date" | "datetime" | "file" | "geopoint" | "image" | ... 5 more ... | undefined> & { ...; } & FieldDefinitionBase'. Object literal may only specify known properties, but 'fields' does not exist in type '{ type: string; name: string; } & TypeAliasDefinition<string, "string" | "number" | "boolean" | "object" | "document" | "url" | "array" | "block" | "date" | "datetime" | "file" | "geopoint" | "image" | ... 5 more ... | undefined> & { ...; } & FieldDefinitionBase'. Did you mean to write 'fieldset'?ts(2345)

and another on of for the bio field:

Argument of type '{ name: string; title: string; type: string; of: { title: string; type: string; styles: { title: string; value: string; }[]; lists: never[]; }[]; }' is not assignable to parameter of type '{ type: string; name: string; } & TypeAliasDefinition<string, "string" | "number" | "boolean" | "object" | "document" | "url" | "array" | "block" | "date" | "datetime" | "file" | "geopoint" | "image" | ... 5 more ... | undefined> & { ...; } & FieldDefinitionBase'. Object literal may only specify known properties, and 'of' does not exist in type '{ type: string; name: string; } & TypeAliasDefinition<string, "string" | "number" | "boolean" | "object" | "document" | "url" | "array" | "block" | "date" | "datetime" | "file" | "geopoint" | "image" | ... 5 more ... | undefined> & { ...; } & FieldDefinitionBase'.ts(2345)

How can I adjust these schema types to still work properly with Sanity CMS but not get these TypeScript errors?

I've got these package versions: next-sanity v9.0.16, sanity 3.44.0, @sanity/types 3.44.0, and typescript 5.0.4.

Answer 1

I was running into the same issue. I'd upgraded a few packages and every time I tried to build I'd get the same errors (fields on image, as well as 'of' arrays). I finally ran npm i typescript@latest to update typescript directly and it seems to have resolved the error and my project build ran without issue.