Language html is not supported

I am trying to use a code block with html (which is supported according to supported languages), but it gives me the following error:

async-syntax-highlighter.js:110 Uncaught (in promise) Error: Language html not supported at Function._callee$ (async-syntax-highlighter.js:110) at tryCatch (runtime.js:45) at Generator.invoke [as _invoke] (runtime.js:274) at Generator.prototype.<computed> [as next] (runtime.js:97) at asyncGeneratorStep (asyncToGenerator.js:3) at _next (asyncToGenerator.js:25) at asyncToGenerator.js:32 at new Promise (<anonymous>) at Function.<anonymous> (asyncToGenerator.js:21) at Function.loadLanguage (async-syntax-highlighter.js:121) at ReactAsyncHighlighter.loadLanguage (async-syntax-highlighter.js:67) at ReactAsyncHighlighter.componentDidMount (async-syntax-highlighter.js:53) at commitLifeCycles (react-dom.development.js:19814) at commitLayoutEffects (react-dom.development.js:22803) at HTMLUnknownElement.callCallback (react-dom.development.js:188) at Object.invokeGuardedCallbackDev (react-dom.development.js:237) at invokeGuardedCallback (react-dom.development.js:292) at commitRootImpl (react-dom.development.js:22541) at unstable_runWithPriority (scheduler.development.js:653) at runWithPriority$1 (react-dom.development.js:11039) at commitRoot (react-dom.development.js:22381) at finishSyncRender (react-dom.development.js:21807) at performSyncWorkOnRoot (react-dom.development.js:21793) at react-dom.development.js:11089 at unstable_runWithPriority (scheduler.development.js:653) at runWithPriority$1 (react-dom.development.js:11039) at flushSyncCallbackQueueImpl (react-dom.development.js:11084) at flushSyncCallbackQueue (react-dom.development.js:11072) at flushPassiveEffectsImpl (react-dom.development.js:22883) at unstable_runWithPriority (scheduler.development.js:653) at runWithPriority$1 (react-dom.development.js:11039) at flushPassiveEffects (react-dom.development.js:22820) at react-dom.development.js:22699 at workLoop (scheduler.development.js:597) at flushWork (scheduler.development.js:552) at MessagePort.performWorkUntilDeadline (scheduler.development.js:164)

here is my implementation

<CopyBlock text={code} language="html" showLineNumbers={true} theme={dracula} wrapLines codeBlock />

[rajinwonderland]

Hey @mat250, this is actually a documentation error on my part.

In order to render html inside a CodeBlock or CopyBlock component, you’ll need to mark the language prop with markup not html.

Like so:

<CopyBlock
  text={code}
  language="markup"
  showLineNumbers={false}
  theme={dracula} 
/>

I’ve posted a codesanbox example here for more context.

We will have to update the docs to reflect this for now.

I’m hoping to implement html as a key that maps to markup in a future version when I have a little more time!

Let me know if you have more questions!

[mat250]

Thanks @rajinwonderland , that’s working !