Skip to content
Rehype Pretty

Line Numbers

Installation

bun add @rehype-pretty/transformers

Usage

You can use this as a shiki transformer in rehype-pretty-code by passing it to the transformers array.

Options

  • autoApply: boolean (default: true)

Examples

with rehype-pretty-code
import { unified } from 'unified'
import remarkParse from 'remark-parse'
import remarkRehype from 'remark-rehype'
import rehypeStringify from 'rehype-stringify'
import { rehypePrettyCode } from 'rehype-pretty-code'
import { transformerLineNumbers } from '@rehype-pretty/transformers'
 
const file = await unified()
  .use(remarkParse)
  .use(remarkRehype)
  .use(rehypePrettyCode, {
    transformers: [
      transformerLineNumbers({ autoApply: true }),
    ],
  })
  .use(rehypeStringify)
  .process(`\`\`\`js\nconsole.log('Hello, World!')\n\`\`\``)
 
console.log(String(file))

with shiki

import { codeToHtml } from 'shiki'
 
const code = await codeToHtml('console.log("Hello World")', {
  lang: 'ts',
  theme: 'vitesse-light',
  transformers: [
    transformerLineNumbers({ autoApply: true }),
  ]
})