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 CWith 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-revisitedCloudflare Worker demo
ツ npx @verikami/remark-deflist-revisited@latest
ツ npx @verikami/remark-deflist-revisited --helpUsage 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 aboveUsage 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@latestpnpm create remark-deflist-revisitedyarn create remark-deflist-revisitednpx @verikami/remark-deflist-revisited@latestnpx @verikami/remark-deflist-revisited --help2025 © MIT \\° veriKami °// Weronika Kami
(▒)(▒)_______███☼███____(▒)(▒)
(▒)(█)(▒)__ ███_☼██████
_(▒)(▒)___██____████████
_________██____███▒▒▄▒▒
__________██____█▒▒▒▒▒▒
___________██____ █▒▒▒♥___(▒)(▒)
____________██_____▒▒____(▒)(█)(▒)
__________ __██____▒▒______(▒)(▒)
_____________██__▓▓▒▓_______█
________██__██ ▓▓▓▒▒▒▓____█
_(▒)(▒)___███_ ▓▓_▓▓▓▓▓___█
(▒)(█)(▒)______▓▓__▓▓▓▓▓___█
_(▒)(▒)_____ _▓▓__▓▓▓▓▓___█___█
___________ ▓▓___▓▓▓▓_▓___█_█
__________ ▓▓___▓▓▓▓__▓▓__█
_________ ▓▓___███☼█__▓▓__█
___♥▒▒♥▒♥▒♥▒♥▒♥▒♥▒♥ __▓▓_█
___ ♥▒♥▒▒♥▒♥▒♥▒♥▒▒♥▒♥__▒▒▒
____ ♥▒♥▒▒♥▒♥▒♥▒▒♥▒▒♥▒____█
______ ♥▒▒♥▒♥▒♥▒♥▒♥▒▒♥▒♥__█
________ ♥▒▒♥▒▒♥▒♥▒▒♥▒▒♥▒♥
___________♥▒♥▒▒♥▒▒♥▒▒♥▒▒♥▒
_______________▓▓_▓▓
_(▒)(▒)_________▓▓_▓▓
(▒)(█)(▒)_______▓▓_▓▓
_(▒)(▒)_________▓▓_▓▓
_______________▓▓_▓▓
_______________▓▓▓▓
_______________▓▓▓
______█████████
________██____██
______█☼█____██
______█_______██
______________█☼█
______________██__█▄
2025 © \\° veriKami °// Weronika Kami