Add Nuxt module for MDX

Add a Nuxt.js module to make MDX usage in Nuxt convenient in Nuxt.js

Currently I’m using MDX with Nuxt. The doesn’t come without the usual gymnastics of having to create a custom router to load the MDX files for pages.

Problem

Nuxt’s builder will ignore all non .vue files in the pages directory by default. In order to make this more convenient, we need to load the files programmatically inside a module.

After exploring this extensively I found that this cannot be done easily in user-land.

Expected behavior

The outcome should look something like the image shown below. MDX files are loaded seamlessly into Nuxt’s builder.

Alternatives

What are the alternative solutions? Please describe what else you have considered?

• Create your own custom router with this kind of gymnastics.
• Manually create module in user land (Non beginner-friendly.)

[codebender828]

Yes. An easy way for people looking to get started with other integrations will be beneficial. I would suggest a page in the docs and in the readme. 🙏

[wooorm]

I really have no experience with nuxt and almost none with react/vue, so I’m not the best person to speak on this.

Unfortunately we don’t yet list integrations on the readme. I think we should do that. Or maybe a new section on the website, under Getting Started, for Vue?