My latest "pro bono" work – (npm/jsr) module for parsing nested definision lists.
Developed on the margins of a certain markdown-related project.
Project (page) → verikami.github.io/remark-deflist-revisited
Remark plugin. A wrapper around remark-deflist
with improved support for nested definition lists.
It preserves all the original functionality and performs additional processing.
Bun, Deno and Cloudflare Workers compatibility. Also works in Astro and web browser.
Project Description
The problem with remark-deflist
is that the plugin renders nested list items inside <dd>
incorrectly.
Term
: - item A
- item B
- item C
With remark-deflist
<dl>
<dt> Term </dt>
<dd>
<ul>
<li> item A </li>
</ul>
</dl>
<ul>
<li> item B </li>
<li> item C </li>
</ul>
With @verikami/remark-deflist-revisited
<dl>
<dt>Term</dt>
<dd>
<ul>
<li> item A </li>
<li> item B </li>
<li> item C </li>
</ul>
</dl>
Installation and Usage
ツ pnpm add @verikami/remark-deflist-revisited
ツ npm i @verikami/remark-deflist-revisited
Cloudflare Worker demo
ツ npx @verikami/remark-deflist-revisited@latest
ツ npx @verikami/remark-deflist-revisited --help
Usage in Node.js
import { remark } from "remark";
import html from "remark-html";
import deflist from "@verikami/remark-deflist-revisited";
const markdown = `
Term
: - item A
- item B
- item C
`;
const output = await remark()
.use(deflist)
.use(html)
.process(markdown);
console.log(String(output));
Usage in Deno
import { remark } from "npm:remark@^15";
import html from "npm:remark-html@^16";
import deflist from "npm:@verikami/remark-deflist-revisited";
// (...) same code as above
Usage in Astro
import remarkDeflist from "@verikami/remark-deflist-revisited";
export default defineConfig({
markdown: {
remarkPlugins: [
remarkDeflist
]
}
});
Usage in Cloudflare Worker
import { remark } from "remark";
import html from "remark-html";
import dedent from "dedent";
import deflist from "@verikami/remark-deflist-revisited";
export default {
async fetch(request, env, ctx) {
const markdown = dedent`
Term
: - item A
- item B
- item C
`;
const output = await remark()
.use(deflist)
.use(html)
.process(markdown);
return new Response(String(output), {
headers: { "Content-Type": "text/html; charset=utf-8" }
});
}
};
Usage in html
<html>
<head>
<script type="module">
import { remark } from "https://esm.sh/remark@15";
import html from "https://esm.sh/remark-html@16";
import dedent from "https://esm.sh/dedent@1";
import deflist from "https://esm.sh/@verikami/remark-deflist-revisited";
const render = async (markdown) => (
await remark()
.use(deflist)
.use(html)
.process(markdown)
);
const append = async (markdown) => {
const output = await render(markdown);
const el = document.getElementById("markdown");
el.innerHTML += String(output);
};
const markdown = dedent`
Term
: - item A
- item B
- item C
`;
document.body.onload = append(markdown);
</script>
</head>
<body>
<div id="markdown"></div>
</body>
</html>
Original work — MIT © Alex Shaw
2025 © MIT \\° veriKami °// Weronika Kami
Examples and Templates
Example implementations for @verikami/remark-deflist-revisited
.
They are also published as standalone repositories (templates):
- Simple → veriKami/remark-deflist-revisited-simple
- Express.js → veriKami/remark-deflist-revisited-express
- Cloudflare Worker → veriKami/remark-deflist-revisited-worker
- Astro → veriKami/remark-deflist-revisited-astro
You can play with these examples via StackBlitz web IDE:
Simple Example | Express Example | Worker Example | Astro Example |
---|---|---|---|
npm create remark-deflist-revisited@latest
pnpm create remark-deflist-revisited
yarn create remark-deflist-revisited
npx @verikami/remark-deflist-revisited@latest
npx @verikami/remark-deflist-revisited --help
2025 © MIT \\° veriKami °// Weronika Kami
(▒)(▒)_______███☼███____(▒)(▒)
(▒)(█)(▒)__ ███_☼██████
_(▒)(▒)___██____████████
_________██____███▒▒▄▒▒
__________██____█▒▒▒▒▒▒
___________██____ █▒▒▒♥___(▒)(▒)
____________██_____▒▒____(▒)(█)(▒)
__________ __██____▒▒______(▒)(▒)
_____________██__▓▓▒▓_______█
________██__██ ▓▓▓▒▒▒▓____█
_(▒)(▒)___███_ ▓▓_▓▓▓▓▓___█
(▒)(█)(▒)______▓▓__▓▓▓▓▓___█
_(▒)(▒)_____ _▓▓__▓▓▓▓▓___█___█
___________ ▓▓___▓▓▓▓_▓___█_█
__________ ▓▓___▓▓▓▓__▓▓__█
_________ ▓▓___███☼█__▓▓__█
___♥▒▒♥▒♥▒♥▒♥▒♥▒♥▒♥ __▓▓_█
___ ♥▒♥▒▒♥▒♥▒♥▒♥▒▒♥▒♥__▒▒▒
____ ♥▒♥▒▒♥▒♥▒♥▒▒♥▒▒♥▒____█
______ ♥▒▒♥▒♥▒♥▒♥▒♥▒▒♥▒♥__█
________ ♥▒▒♥▒▒♥▒♥▒▒♥▒▒♥▒♥
___________♥▒♥▒▒♥▒▒♥▒▒♥▒▒♥▒
_______________▓▓_▓▓
_(▒)(▒)_________▓▓_▓▓
(▒)(█)(▒)_______▓▓_▓▓
_(▒)(▒)_________▓▓_▓▓
_______________▓▓_▓▓
_______________▓▓▓▓
_______________▓▓▓
______█████████
________██____██
______█☼█____██
______█_______██
______________█☼█
______________██__█▄
2025 © \\° veriKami °// Weronika Kami