What's the Difference between Remark & Rehype?

Question

I'm a bit confused. I think remark is a markdown processor, rehype is an html processor. So remark takes some markdown, transforms it, and gives me back some markdown. Rehype takes some html, transforms it, and gives me back some html - is this correct?

For example: I came across the packages remark-slug and rehype-slug, and they appear to do basically the same thing—what is the difference between the two?

Wreckage

for reference, I found these articles helpful: 1. An Introduction to Unified and Remark, 2. Transforming Markdown with Remark & Rehype, 3. How to debug unified, rehype, or remark and fix bugs in markdown processing – Wallenstein

Answer 1

Not quite right. remark and rehype are Node.js-based processors in the unified collective. They support parsing markdown and HTML respectively to/from syntax trees. All such processors in the unified collective support 'plugins' that enable you to inspect and manipulate the intermediary syntax trees. Powerful stuff.

remark-slug and rehype-slug are third-party plugins for their respective unified collective processors, remark and rehype. From the slugs' descriptions I gather these plugins are used to turn "headings" into navigable items (Anchors/Bookmarks).

You decide what to use based on your input and output formats and what, if any, inspection or transformation you want to accomplish. You may use some or all of them.

Shalne

"You may use some or all of them..." or, create your own plug-in(s). – Shalne

Here's another's take Transforming Markdown with Remark & Rehype, When to use Each - Ryan Filler. – Shalne

Answer 2

remark unified processor with support for parsing from markdown and serializing to markdown.

rehype unified processor to add support for parsing from HTML and serializing to HTML.

Eyrie