Importing Marked For Markdown Previewer Project

Hi FCC! My markdown project is going well so far, up until the point where I need to import the marked library. I’m really not sure how to do this. I’ve looked up some tutorials but different ones are saying wildly different things. Can you please give me a step by step on how to get the marked library to work?
I’m using CodePen to write HTML, CSS, and React JS. Here’s my CodePen:

Thank you!

When using CodePen, I import all of my dependencies via the settings like this:

I don’t have any import statements, cdn links etc in my actual code.

Thank you! I’ve imported Marked:

What do I need to write in my code to make it work with the preview element? Different tutorials had crazy different ideas

I used dangerouslySetInnerHTML in my CodePen:

Here’s a Stack Overflow about it: reactjs - Using marked in react - Stack Overflow

1 Like

Thank you! That was so helpful.
I put in these pieces of code:
But as you can see, it’s throwing an error and saying marked isn’t a function. Also, my rendered UI has disappeared and no longer passes the tests it previously was passing.
I’m sorry to cause you trouble, but please help me figure this out if you can!

Read the documentation for the library.

For the version of the library you are using, when using it as a script (not an import), you have to use the .parse() method.

1 Like

That did the trick! Thank you both so much!!!

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.