Ben Borgers / Posts /

How to use react-helmet-async with Gatsby

January 24, 2021 by @benborgers

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>
  )
}

A quick favor: was anything I wrote incorrect or misspelled, or do you still have questions? Please use this form to let me know or ask for help!

Loading...