Transforms hmtl image with relative src into absolute
npm install rehype-abs-image
npm i rehype-abs-image
`Usage
Let's create a simple script, that will take test.md and transform it into out.html.` ts
import fs from 'fs/promises';
import { unified } from "unified";
import remarkParse from "remark-parse";
import remarkRehype from "remark-rehype";
import rehypeStringify from "rehype-stringify";
import rehypeRaw from "rehype-raw";
import rehypeAbsImage from "../src/index.js";
import path from 'path';// your unified plugins
const processor = unified()
.use(remarkParse)
.use(remarkRehype, { allowDangerousHtml: true })
.use(rehypeRaw)
// it's necessary to set prefix here
.use(rehypeAbsImage, { prefix: 'https://github.com' })
.use(rehypeStringify);
const asyncWrapper = async () => {
// read input file
const mdPath = path.resolve('./example/test.md');
const origFile = await fs.readFile(mdPath);
// transform
const output = await processor.process(origFile);
// write output
const outPath = path.resolve('./test_dist/out.html');
await fs.writeFile(outPath, output.value);
};
asyncWrapper();
`Result
Input (test.md)
` md
Headline One
Headline two
Some text here



`Output (out.html)
` html
Headline One
Headline two
Some text here



``