Problem with ChefClaude react-markdown

The code doesn’t work for me; I get an error “SyntaxError: The requested module ‘decode-named-character-reference’ does not provide an export named ‘decodeNamedCharacterReference’”

it it a problem related to the markdown plugin? I am trying the same code that works in the lesson but doesn’t work for me

1 Like

Kindly let me know when you have the solution.

I am going through the same error on the “useEffect practice: scrollIntoView()” lesson.

@bobziroll Any insight on this? We discussed about an issue recently but not sure if this is a new one.

@molokoid Do you have a scrim link you could share so I can check it out? Or the name of which scrim you’re running into this issue on? I’ll check it out

you can see the problem in this scrim “Format recipe response”.

1 Like

Yup, I found it. It appears react-markdown@9 suddenly has a problem with using the release-candidate version of react@19 (react@rc), but only in Scrimba. I’ll forward this on to the dev team to see if we can get a resolution.

Thanks for submitting the issue @molokoid!

4 Likes

Upgrading the dependency to react-markdown@10.1.0 fixes this syntax error issue. However, upon attempting to generate the recipe, a new error appears.

!
Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports. Check the render method of `ClaudeRecipe`.
▲
An error occurred in the <section> component. Consider adding an error boundary to your tree to customize error handling behavior. Visit https://react.dev/link/error-boundaries to learn more about error boundaries.

I attempted to upgrade all dependencies and re-reread the docs, but to no avail…

I am also having this same problem and in trying to fix it also reproduced the error @jarprod reported above. Need to fix it please guys! Dependencies listed here:

Here is my code.
Note, I get the same result if I pass my simple markdown string variable into the ReactMarkdown block.

Over on the discord server, user Daniel had this answer: This appears to be a problem with react-markdown and Scrimba. Until there is a fix, you can try using marked-react instead. To do this:

  1. In ClaudeRecipe.jsx change import ReactMarkdown from "react-markdown" to import ReactMarkdown from "marked-react",
  2. Add marked-react to the list of dependencies in the left panel

I have done this and can confirm it works.

1 Like