MDX와 리액트
도큐사우루스는 MDX v2를 기본 지원하며, MDX를 통해 마크다운 파일 내에서 JSX를 작성해서 리액트 컴포넌트를 표현할 수 있습니다.
Check out the MDX docs to see what fancy stuff you can do with MDX.
Debugging MDX
The MDX format is quite strict, and you may get compilation errors.
Use the MDX playground to debug them and make sure your syntax is valid.
컴포넌트 내보내기
To define any custom component within an MDX file, you have to export it: only paragraphs that start with export
will be parsed as components instead of prose.
export const Highlight = ({children, color}) => (
<span
style={{
backgroundColor: color,
borderRadius: '2px',
color: '#fff',
padding: '0.2rem',
}}>
{children}
</span>
);
<Highlight color="#25c2a0">도큐사우루스 초록</Highlight>과 <Highlight color="#1877F2">페이스북 파랑</Highlight>은 내가 좋아하는 색입니다.
**마크다운**을 _JSX_와 같이 사용할 수 있습니다!