react 에 md 파일 적용시키기

react-markdown 모듈을 이용해서 쉽게 적용 가능했다.

npm i react-markdown

설치후, 적용할 파일 상위에 react-markdown을 import 시켜준다.

import ReactMarkdown from 'react-markdown';

그리고 적용할 md 형식의 text 를 변수로 저장한다.

const Markdown = `
# **TEST TITLE**

1. TEST1
    - TEST1-1
    - TEST1-2
    - TEST1-3
    - TEST1-5
2. TEST2
3. TEST3
`

아래처럼 적용시켜주면 끝난다!

<ReactMarkdown children={markdown} remarkPlugins={[remarkGfm]} />

remarkPlugins 에 추가로 들어가는 remarkGfm 을 이용하면, link, table,checklist 등의 형식을 표현할 수 있다.

마찬가지로 모듈 설치 후 적용하면 된다.

npm i remark-gfm

참고: https://www.npmjs.com/package/react-markdown