esbuild-plugin-alias VS mdx-bundler

I think you should be able to do something similar to the webpack config that Vue ships would be to use https://github.com/igoradamenko/esbuild-plugin-alias and pass in a similar `runtimeCompiler` option to your build script.

Personally using https://github.com/kentcdodds/mdx-bundler

Exact code could be different if you're using mdx-bundler, Contentlayer, or anything else. But there should be a similar API for adding components.

mdx-bundler

Do note that Code Hike also works with Next MDX Remote and MDX Bundler however, we are going to look at a simple example with the official MDX plugin for Next.js.

i'm having a hard time finding a solution, just like others → https://github.com/kentcdodds/mdx-bundler/issues/70

Depends on what functionality you'd like to add as you go. I recently built my site from scratch (with no prior experience) using NextJS, MDX and mdx-bundler [1]. Having the ability to add custom components, or statically generate a related posts matrix are all super useful.

1: https://github.com/kentcdodds/mdx-bundler

https://olickel.com

MDX Bundler differs from all of the other packages listed above in that it is Framework agnostic, meaning you can use it outside of Next.js. Like next-mdx-remote, no changes to the next.config.js file are necessary.

To make Next.js works with MDX, we need to compile and bundle the markdown files. For this task, I decided to go with the new mdx-bundler library made by the famous Kent C. Dodds.