I am currently using Strapi as my CMS and NextJs/React as my frontend. I have included 1 field in my strapi as a rich content field. When I add my content in Strapi itself and see the preview, it shows the correct output with all the spacings and underlines etc. But when I switch to webpage view, it all comes as 1 sentence without any stylings. Places where I had made underlines show up as <u>Sentence</u> in my webpage.
Here is my current code:
export default function name({ posts }) {
return (
<>
<div>
<div>
{posts.Title}
</div>
</div>
<div>
{posts.Content}
</div>
<Carousel />
</>
);
}
// Tell nextjs how many pages are there
export async function getStaticPaths() {
const res = await fetch("http://localhost:1337/blogs");
const posts = await res.json();
const paths = posts.map((blog) => ({
params: { id: blog.id.toString() },
}));
return {
paths,
fallback: false,
};
}
// Get data for each individual page
export async function getStaticProps({ params }) {
const { id } = params;
const res = await fetch(`http://localhost:1337/blogs?id=${id}`);
const data = await res.json();
const posts = data[0];
return {
props: { posts },
};
}
Webpage Preview:
Getting the following error when I imported react-markdown
