MDX for Next.js

Adds support for MDX with advanced syntax features in Next.js applications

Advanced MDX support for Next.js

Adds support for MDX with advanced syntax features in Next.js applications

Cross-Platform Compatibility Build Status

Coverage Status Dependencies

npm License Buy us a tree

This library wraps the official Next.js + MDX plugin and configures it with additional Remark and Rehype plugins to enable advanced Markdown syntax and make MDX easier to use for our specific use-cases.

Features

Usage

Install the library via npm:

npm install @jsdevtools/next-mdx

Then use it in your next.config.js file:

const nextMDX = require("@jsdevtools/next-mdx");

const withMDX = nextMDX({
  // Next-MDX options go here
  siteURL: "http://example.com"
});

module.exports = withMDX({
  // Next.js options go here
  pageExtensions: ["tsx", "mdx"],
});

Options

See options.ts for all of the options that you can pass to Next-MDX.

NOTE: Don’t confuse the Next-MDX options with the Next.js options. Refer to the code example above to see where each goes.

Contributing

Contributions, enhancements, and bug-fixes are welcome! Open an issue on GitHub and submit a pull request.

Building

To build the project locally on your computer:

  1. Clone this repo
    git clone https://github.com/JS-DevTools/next-mdx.git

  2. Install dependencies
    npm install

  3. Build the code
    npm run build

  4. Run the tests
    npm test

License

Next MDX is 100% free and open-source, under the MIT license. Use it however you want.

This package is Treeware. If you use it in production, then we ask that you buy the world a tree to thank us for our work. By contributing to the Treeware forest you’ll be creating employment for local families and restoring wildlife habitats.

Big Thanks To

Thanks to these awesome companies for their support of Open Source developers ❤

GitHub NPM Coveralls Travis CI SauceLabs