next.jsmdxjs

Module not found: Can't resolve 'next-mdx-import-source-file'

I am trying to get @next/mdx running with the new app directory. I followed the setup in the Readme of the package but i get the following error message when I try to render an mdx page. I can not find any information on this package what so ever.

Module not found: Can't resolve 'next-mdx-import-source-file'
  1 | import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
> 2 | import { useMDXComponents as _provideComponents } from "next-mdx-import-source-file";
  3 | function _createMdxContent(props) {
  4 |     const _components = Object.assign({
  5 |         h1: "h1",
Solution

  • This error occurs if the file mdx-components.js is not present in the project root directory.

    This dependency is not an actual package but rather some next magic which actually imports the mdx-components.js file. In my case I missed out on on the plural.