How to use react-helmet-async with Gatsby

April 23, 2020

When you replace react-helmet with react-helmet-async, you can use the Gatsby plugin @rhysforyou/gatsby-plugin-react-helmet-async to make it work with Gatsby.

Just install the plugin:

npm install @rhysforyou/gatsby-plugin-react-helmet-async

And include the plugin in gatsby-config.js:

module.exports = {
  plugins: [
    "@rhysforyou/gatsby-plugin-react-helmet-async"
  ]
}

Now, you can use react-helmet-async in your Gatsby site:

import React from "react"
import { Helmet } from "react-helmet-async"

export default () => {
  return (
    <Helmet>
      <title>Candlemaker Corner</title>
    </Helmet>
  )
}

Follow my twitter (@benborgers) to see the work-in-progress of coding projects Iā€™m working on!