JavaScript for WordPress Forums Gatsby Gatsby Basics: gatsby-mdx is depreciated, use gatsby-plugin-mdx instead Reply To: Gatsby Basics: gatsby-mdx is depreciated, use gatsby-plugin-mdx instead

#121461
Alex Fornuto
Participant

Related, when I got to Adding React Components to MDC Files, I was unable to load the Shoutout component from within the markdown file. To resolve:

  1. Go to posts.js and add:
    
    import { MDXProvider } from "@mdx-js/react"
    import Shoutout from "../components/shoutout"
    
    const shortcodes = {
        Shoutout
    }
    
  2. And where you import the content, adjust to:
    
            <MDXProvider components={shortcodes}>
                <MDXRenderer>{content}</MDXRenderer>
            </MDXProvider>
    
  3. Now in your markdown file, you can use <Shoutout> tags without importing.

I hope this helps others.

  • This reply was modified 3 years, 1 month ago by Alex Fornuto. Reason: Adjust formatting