Rspress plugin to align images in markdown.
This plugin works by wrapping images in a div element with classes that aligns the image.
npm i rspress-plugin-align-image
pnpm add rspress-plugin-align-imageimport * as path from 'path';
import { defineConfig } from 'rspress/config';
import alignImage from 'rspress-plugin-align-image';
export default defineConfig({
root: path.join(__dirname, 'docs'),
plugins: [alignImage()],
});Align the image to the left, right or center.
- Type:
'left' | 'right' | 'center' - Default:
'center'
Addtional class names to add to the container div element.
- Type:
string[]
import * as path from 'path';
import { defineConfig } from 'rspress/config';
import alignImage from 'rspress-plugin-align-image';
export default defineConfig({
root: path.join(__dirname, 'docs'),
plugins: [
alignImage({
justify: 'left',
containerClassNames: ['my-class'],
}),
],
});The configuration above will align the image to the left and add the class my-class to the container div element:
<div class="my-4 flex flex-row justify-start my-class">
<img src="image.jpg" />
</div>