title: Can't require remark and rehype plugins for gatsby-plugin-mdx
body: <p>I was trying to follow the <a href="https://www.gatsbyjs.com/plugins/gatsby-plugin-mdx/#rehype-plugins" rel="noreferrer">documentation</a> on including rehype plugins for gatsby-plugin-mdx. Specifically I was trying to use the <code>rehype-slug</code> plugin. I installed the packaged with npm and set my <code>gatsby.config.js</code> file to</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>module.exports = {
    siteMetadata: {
      siteUrl: "https://www.yourdomain.tld",
      title: "test Website",
    },
    plugins: [
      {
        resolve: "gatsby-plugin-mdx",
        options:{
          rehypePlugins: [
            require("rehype-slug")
          ]
        }
      }
    ],
  };</code></pre>
  </div>
  </div>
  
  However upon running <code>gatsby develop</code> I encouter the following error:
  <code>Error: [ERR_REQUIRE_ESM]: Must use import to load ES Module: C:\Users\User\Documents\test-site\node_modules\rehype-slug\index.js require() of ES modules is not supported.</code></p>
  <p>I encouter similar problems when trying to use the <code>remark-math</code> and <code>rehype-katex</code> plugins. I'm using version 3.13.0 of the Gatsby CLI. The problem persists even with a completely new website. Any help with this issue would be much appreciated.</p>