Others

Displaying diffs with syntax highlighting using Rehype Pretty Code (Shiki)

Others

This blog uses Rehype Pretty Code, which I introduced in a previous post. With Rehype Pretty Code, you can display a diff by setting the language to diff, like this: Next, import transformerNotationDiff from @shikijs/transformers: Then pass it as a Rehype Pretty Code option.…

Adding line numbers and highlighting lines with Rehype Pretty Code

Others

Last time, we set up syntax highlighting with Rehype Pretty Code (rehype-pretty-code) and changed the theme. This time, let's go a step further and add line numbers and highlight specific lines inside code blocks. Rehype Pretty Code lets you configure a highlighted code block…

Getting beautiful syntax highlighting with Rehype Pretty Code

Others

If you're writing a technical blog, syntax highlighting is a must. So in this post, let's set it up. The package we'll use is a rehype plugin called Rehype Pretty Code, which does its highlighting with Shiki. Prism is the famous name in syntax highlighting, but this time I went…