3. 3
    Use a React Component from NPM in an MDX File with Gatsby MDX
    46s

Use a React Component from NPM in an MDX File with Gatsby MDX

InstructorChris Biscardi

Share this video with your friends

Send Tweet

MDX allows you to use JSX and React components directly inline in your Markdown. Here's how.

Emma Bostian
~ 5 years ago

Hey Chris! Really enjoying the course thus far, but it's really hard to see which packages you're installing sometimes since it goes quickly. Would it be possible to add the yarn install <package> commands to the descriptions? That would be really helpful!

Chris Biscardiinstructor
~ 5 years ago

Hey Emma, I'll try to get that done and I'll especially keep the speed in mind for future videos. Thanks for the feedback!

Quang Le
~ 4 years ago

Hi Chris, thank you for the course. I follow your steps and have <SketchPicker /> component on my mdx file, it displays the color picker but it is not interactive. I did run gatsby clear and gatsby develop, but it still didn't work. Do you have any idea? Thanks.

Chris Biscardiinstructor
~ 4 years ago

Something changed in the way SketchPicker and Gatsby's updates interact and it no longer works with that package. Luckily it's only a problem with that specific package, any other one should work, such as this one:

import { HexColorPicker } from "react-colorful"

# Hello

<HexColorPicker />