[javascript] Marked의 커스텀 렌더러를 사용하여 HTML 출력을 변경하는 방법은?

30 Nov 2023

javascript

const marked = require('marked');

const renderer = new marked.Renderer();
renderer.heading = function (text, level) {
  // 사용자 지정 HTML 마크업으로 변경
  return `<h${level} class="custom-heading">${text}</h${level}>`;
};

marked.setOptions({
  renderer: renderer
});

const markdown = '# 제목입니다\n\nMarkdown을 변환합니다.';
const html = marked(markdown);

console.log(html);

위의 코드는 Marked를 사용하여 Markdown을 HTML로 변환하는 예제입니다. 커스텀 렌더러를 생성하고, heading 메소드를 오버라이딩하여 사용자 지정 HTML 마크업으로 변경하였습니다. setOptions 함수를 사용하여 Marked에 생성한 커스텀 렌더러를 설정하고, marked 함수를 호출하여 Markdown을 HTML로 변환합니다.

위의 예제에서는 제목을 예시로 사용하여 heading 메소드만 오버라이딩하였지만, 다른 요소들에 대해서도 동일한 방법으로 커스텀 HTML 마크업으로 변경할 수 있습니다. 이를 통해 Marked를 자신의 요구사항에 맞게 커스터마이징할 수 있습니다.

더 자세한 내용은 Marked의 공식 문서를 참조하세요.