config ?

src/lib/markdown.ts

@@ -1,14 +1,11 @@
 import fs from 'fs';
 import path from 'path';
 import matter from 'gray-matter';
-import { remark } from 'remark';
-import html from 'remark-html';
-import gfm from 'remark-gfm';
+import { marked } from 'marked';
+import DOMPurify from 'dompurify';
+import { JSDOM } from 'jsdom';
 import chokidar from 'chokidar';
 import type { FSWatcher } from 'chokidar';
-import remarkRehype from 'remark-rehype';
-import rehypeRaw from 'rehype-raw';
-import rehypeStringify from 'rehype-stringify';
 
 export interface Post {
   slug: string;
@@ -36,12 +33,38 @@ export async function getPostBySlug(slug: string): Promise<Post> {
   const { data, content } = matter(fileContents);
   const createdAt = getFileCreationDate(fullPath);
 
-  const processedContent = await remark()
-    .use(gfm)
-    .use(remarkRehype, { allowDangerousHtml: true })
-    .use(rehypeRaw)
-    .use(rehypeStringify)
-    .process(content);
+  let processedContent = '';
+  try {
+    marked.setOptions({
+      gfm: true,
+      breaks: true
+    });
+    const rawHtml = marked.parse(content);
+    const window = new JSDOM('').window;
+    const purify = DOMPurify(window);
+    processedContent = purify.sanitize(rawHtml as string, {
+      ALLOWED_TAGS: [
+        'h1', 'h2', 'h3', 'h4', 'h5', 'h6',
+        'p', 'a', 'ul', 'ol', 'li', 'blockquote',
+        'pre', 'code', 'em', 'strong', 'del',
+        'hr', 'br', 'img', 'table', 'thead', 'tbody',
+        'tr', 'th', 'td', 'div', 'span', 'iframe'
+      ],
+      ALLOWED_ATTR: [
+        'class', 'id', 'style',
+        'href', 'target', 'rel',
+        'src', 'alt', 'title', 'width', 'height',
+        'frameborder', 'allowfullscreen'
+      ],
+      ALLOWED_URI_REGEXP: /^(?:(?:(?:f|ht)tps?|mailto|tel|callto|cid|xmpp):|[^a-z]|[a-z+.\-]+(?:[^a-z+.\-:]|$))/i
+    });
+  } catch (err) {
+    console.error(`Error processing markdown for ${realSlug}:`, err);
+    processedContent = `<div class="error-message">
+      <p>Error processing markdown content. Please check the console for details.</p>
+      <pre>${err instanceof Error ? err.message : 'Unknown error'}</pre>
+    </div>`;
+  }
 
   return {
     slug: realSlug,
@@ -49,7 +72,7 @@ export async function getPostBySlug(slug: string): Promise<Post> {
     date: data.date,
     tags: data.tags || [],
     summary: data.summary,
-    content: processedContent.toString(),
+    content: processedContent,
     createdAt,
     author: process.env.NEXT_PUBLIC_BLOG_OWNER || 'Anonymous',
   };