Nougat Predominant Middleware

    remark-mdx-next-image

    0.0.2 • Public • Published

    remark-mdx-next-image

    transform your images in markdown files

    Effects

    Markdown

    ![background](../images/image.png)

    JSX

    import NextImage from 'next/image'
    import imageSrc0 from '../images/image.png
    
    // transform to static images by using next/image
    <NextImage src={imageSrc0} alt="background" />

    Usage

    yarn add -D remark-mdx-next-image
    

    Configure next.config.js

    const transformNextImage = require('remark-mdx-next-image')
    
    // configure webpack loader for md and mdx files
    {
      test: /\.mdx?$/,
      use: [
        options.defaultLoaders.babel,
        {
          loader: '@mdx-js/loader',
          options: {
            remarkPlugins: [
              transformNextImage
            ]
          },
        }
      ],
    }

    Notice

    Current version is only compatible with @mdx-js/loader v1.

    Keywords

    none

    Install

    npm i remark-mdx-next-image

    DownloadsWeekly Downloads

    0

    Version

    0.0.2

    License

    MIT

    Unpacked Size

    2.7 kB

    Total Files

    3

    Last publish

    Collaborators

    • huozhi