Home > Enterprise >  How to import a markdown file in NextJS
How to import a markdown file in NextJS

Time:10-05

So, I'm trying to display pure markdown in my NextJS Typescript page, I tried it:

import React, { useState, useEffect } from "react";
import markdown from "./assets/1.md";

const Post1 = () => {
  return <>{markdown}</>;
};

export default Post1;

But I got it:

./pages/blog/assets/1.md
Module parse failed: Unexpected character ' ' (1:1)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> # Apresentations
| 
| Hi, my name is Vitor Koch

I already created the markdown.d.ts file

Obs.: I don't want to convert md to jsx, just want to display it, I already did it in this gist

CodePudding user response:

Oh now I get it. You could try this then:

return <>{JSON.stringify(markdown, 2, null)}</>;
  • Related