I used Markdown-to-jsx package to read my .md files and display them on a page , But they're actually being displayed as a normal text ( See the attached image )

Here's my code :

 import React from 'react'
import fs from 'fs';
import Markdown from 'markdown-to-jsx';


const getPostContent = (slug: string) => {
    const folder = 'posts/';
    const files = `${folder}${slug}.md`;
    const content = fs.readFileSync(files, 'utf8');
    return content
}

const Page = (props: any) => {
    const Content = getPostContent(props.params.slug);
    return (
        <div>
            <Markdown>{Content}</Markdown>
        </div>
    )
}

export default Page