Using new HtmlFieldPlugin in Gatsby

Now that HtmlFieldPlugin has been pulled out and put in it’s own component, I’m not sure how to use it in a Gatsby project. I tried adding react-tinacms-editor as a plugin in gatsby-config, which then complained that I didn’t have react-tinacms-inline installed, so I yarn added it as well. Gatsby didn’t complain, but the html field doesn’t show either.

Hey, react-tinacms-editor isn’t a gatsby plugin.

There’s some instructions here.

But, this gave me an idea. I’m going to make sure gatsby-tinacms-markdown includes those plugins.

Can you also make sure that gatsby-tinacms-json includes those plugins or provide a way to load them. With the latest change, I’m getting the Depreicated: HTML Field message. Thanks

You can add this to your gatsby-browser.js file

exports.onClientEntry = () => {
  import('react-tinacms-editor').then(
    ({ HtmlFieldPlugin, MarkdownFieldPlugin }) => {
      window.tinacms.fields.add(HtmlFieldPlugin)
      window.tinacms.fields.add(MarkdownFieldPlugin)
    }
  )
}

Thanks. That did the trick.