Remark Image

Convert images into static imports

Usage

Convert images into imports (MDX only).

import { remarkImage } from 'fumadocs-core/mdx-plugins';
 
export default {
  remarkPlugins: [remarkImage],
};

![Hello](./hello.png)

Yields:

import HelloImage from './hello.png';
 
<img alt="Hello" src={HelloImage} />

You need an image loader to handle image imports. In Next.js, this is already done by a Webpack/Turbopack plugin

Last updated on

Remark Docs Generation

Remark Structure