React Native Requires Chilkat v11.2.0+

Markdown to HTML - Full Document, ChatGPT Theme with Code Syntax Highlighting

See more Markdown Examples

Demonstrates how to convert a complete Markdown document to HTML using the pre-defined "ChatGPT" theme but also with Cloudfare Prism's code syntax highlighting. React Native

import { JsonObject, StringBuilder } from '@chilkat/react-native'

function chilkatExample() {
  // Select the pre-defined "ChatGPT" style.
  const options = new JsonObject();
  options.updateString('theme', 'ChatGPT');

  // We can also set an option for the max-width, which by default is "72ch".
  options.updateString('ChatGPT.max-width', '120ch');

  // We can add extra content to the bottom of the HTML head and body sections like this:
  // Here we are using the "tomorrow" theme.
  options.updateString('extraHead', '<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/themes/prism-tomorrow.min.css" />');
  options.updateString('extraBody', '<script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/prism.min.js"></script><script src ="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/plugins/autoloader/prism-autoloader.min.js"></script>');

  const sbMarkdown = new StringBuilder();
  const sbHtml = new StringBuilder();

  try {
    sbMarkdown.loadFile('qa_data/markdown/test1.md', 'utf-8');
  } catch {
    console.log(sbMarkdown.lastErrorText);
    return;
  }

  sbMarkdown.markdownToHtml(options, sbHtml);
  sbHtml.toCRLF();

  console.log(sbHtml.getAsString());

  // The sample markdown input for this example is identical to the one at Markdown to HTML - Full Document, Raw, where you can view it.

  // Sample HTML output as viewed in a browser:

  // 
}