Missing serializers for block type figure

[bjornarhagen]

Version 2.0.7

I'm making a website using the NextJS landing page template made by you guys: https://github.com/sanity-io/sanity-template-nextjs-landing-pages.

If I insert an image in a text box (type: portableText), it creates the following error:

Error: Unknown block type "figure", please specify a serializer for it in the 'serializers.types' prop

If I add the following code to src/serializers.js under funciton BlockSerializer(props), it fixes the error:

if (blockType === 'figure') {
    serializer = serializers.types['image'];
}

Is there any good way to fix this locally without editing the file directly inside node_modules, or will you guys be able to provide a fix within some days?

[gsdavris]

to fix this locally without editing the file directly inside node_modules

const serializers = { types: { figure: ({ node: { asset, caption } }) => { return <img src={asset} alt={caption} />; } } };

[JoseGarciaM]

Im having the same error: Error: Unknown block type "localeBlockContent", please specify a serializer for it in the serializers.types prop

ut where do I put the solution? Thank you!

[gsdavris]

do you use @sanity/block-content-to-react ??

https://github.com/sanity-io/block-content-to-react

[JoseGarciaM]

Yes =). And if my type in my schema is just blockContent it works fine, but with the type localeBlockContent it crashes

[mindmergedesign]

Same issue here. I add the serializer but I get the following error:

Uncaught Error: Unknown block type "photo", please specify a serializer for it in the `serializers.types` prop

//serializer
...
const serializers = {
  types: {
    photo: ({ node }) => {
      if (!node.asset) return null
      return <Image src={node.asset} alt=" " />
    },
  },
}

//block
<BlockContent
    blocks={page._rawHeroContent}
    serializers={serializers}
/>

[gulshkr]

What is this error Error: Unknown block type "undefined", please specify a serializer for it in the serializers. types prop

This error happened while generating the page. Any console logs will be displayed in the terminal window.

<PortableText // Pass in block content straight from Sanity.io content={blogs[0].content} projectId= "o80s1fnk" dataset= "production" // Optionally override marks, decorators, blocks, etc. in a flat // structure without doing any gymnastics

  serializers={{
    h1: (props) => <h1 style={{ color: "red" }} {...props} />,
    li: ({ children }) => <li className="special-list-item">{children}</li>

  }}
/>

[TechDevSaga]

same error error - Error: Unknown block type "undefined", please specify a serializer for it in the serializers.types prop

  <PortableText
      // Pass in block content straight from Sanity.io
      content={blogs[0].content}
      projectId="oeqragbg"
      dataset="production"
      // Optionally override marks, decorators, blocks, etc. in a flat
      // structure without doing any gymnastics
      serializers = {{
        h1: (props) => <h1 style={{ color: "red" }} {...props} />,
        li: ({ children }) => <li className="special-list-item">{children}</li>,

      }}
    />