← benborgers.com/blog

How to fix react-helmet "componentWillMount has been renamed" error

I was using the react-helmet package, and noticed an error in my console saying:

Warning: componentWillMount has been renamed, and is not recommended for use. See https://fb.me/react-async-component-lifecycle-hooks for details.

Turns out, in the next version of React 17 (the next version of React), the componentWillMount method will no longer work. react-helmet relies on this method, and therefore there's a warning when you try to use componentWillMount in React 16.9+.

Theres an open issue on GitHub for fixing this, but it doesn't look like the NFL (which made react-helmet) is actively maintaining the package.

Solution

There's a virtually identical package called react-helmet-async, which doesn't have this error and will continue working through React 17. Replacing react-helmet with react-helmet-async everywhere in my code got rid of the warning for me.

Solving it in Gatsby

If your site is built with Gatsby, you're probably currently using gatsby-plugin-react-helmet. You'll need to replace this plugin with @rhysforyou/gatsby-plugin-react-helmet-async.