Rendering Guide

import { marked, Renderer } from "marked";

const renderer = new Renderer();

// Override heading rendering
renderer.heading = ({ tokens, depth }) => {
  const text = renderer.parser.parseInline(tokens);
  const id = text.toLowerCase().replace(/[^\w]+/g, '-');
  return `<h${depth} id="${id}">${text}</h${depth}>\n`;
};

// Override link rendering
renderer.link = ({ href, title, tokens }) => {
  const text = renderer.parser.parseInline(tokens);
  const titleAttr = title ? ` title="${title}"` : '';
  const external = href.startsWith('http') ? ' target="_blank" rel="noopener"' : '';
  return `<a href="${href}"${titleAttr}${external}>${text}</a>`;
};

marked.setOptions({ renderer });