Best way to handle MDX with Next
Answered
Brown bear posted this in #help-forum
Brown bearOP
Has anyone created a detailed pro/con list with the different solutions to handling MDX file parsing with Next?
I'm questioning whether it'd make more sense to use
I'm questioning whether it'd make more sense to use
contentlayer or @next/mdx for a project, or if I should roll with something a bit more "custom" that leverages something like react-markdownAnswered by fuma
If you want to have more control over processing mdx, go with Contentlayer.
Contentlayer handles many kinds of content rather than MDX documents. However, they run in a different runtime under the hood to generate documents, this means you can’t share anything across the runtime.
Contentlayer:
- Multiple sources, support for remote sources
- Markdown and MDX
- Extra support for images
- Automatically cache your documents, Typesafe support
- Easier to process documents
- Advanced usages
But
- Dependency conflicts often occurs
- Run in different runtime
- well-maintained, developed by official Next.js team
- Simple and easy to use
- Better performance compared to Contentlayer
But
- Less documented
- Lack of advanced features
That is based on my experience, may not 100% correct but you can take it as a reference.
Contentlayer handles many kinds of content rather than MDX documents. However, they run in a different runtime under the hood to generate documents, this means you can’t share anything across the runtime.
next/mdx is simple and well-maintained, but you have to build your own layer to process the document, for example, extract the headings. It’s just enough for simple usages, not as well-documented as Contentlayer.Contentlayer:
- Multiple sources, support for remote sources
- Markdown and MDX
- Extra support for images
- Automatically cache your documents, Typesafe support
- Easier to process documents
- Advanced usages
But
- Dependency conflicts often occurs
- Run in different runtime
next/mdx- well-maintained, developed by official Next.js team
- Simple and easy to use
- Better performance compared to Contentlayer
But
- Less documented
- Lack of advanced features
That is based on my experience, may not 100% correct but you can take it as a reference.
2 Replies
If you want to have more control over processing mdx, go with Contentlayer.
Contentlayer handles many kinds of content rather than MDX documents. However, they run in a different runtime under the hood to generate documents, this means you can’t share anything across the runtime.
Contentlayer:
- Multiple sources, support for remote sources
- Markdown and MDX
- Extra support for images
- Automatically cache your documents, Typesafe support
- Easier to process documents
- Advanced usages
But
- Dependency conflicts often occurs
- Run in different runtime
- well-maintained, developed by official Next.js team
- Simple and easy to use
- Better performance compared to Contentlayer
But
- Less documented
- Lack of advanced features
That is based on my experience, may not 100% correct but you can take it as a reference.
Contentlayer handles many kinds of content rather than MDX documents. However, they run in a different runtime under the hood to generate documents, this means you can’t share anything across the runtime.
next/mdx is simple and well-maintained, but you have to build your own layer to process the document, for example, extract the headings. It’s just enough for simple usages, not as well-documented as Contentlayer.Contentlayer:
- Multiple sources, support for remote sources
- Markdown and MDX
- Extra support for images
- Automatically cache your documents, Typesafe support
- Easier to process documents
- Advanced usages
But
- Dependency conflicts often occurs
- Run in different runtime
next/mdx- well-maintained, developed by official Next.js team
- Simple and easy to use
- Better performance compared to Contentlayer
But
- Less documented
- Lack of advanced features
That is based on my experience, may not 100% correct but you can take it as a reference.
Answer