mirror of https://github.com/vuejs/vitepress
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
46 lines
1.2 KiB
46 lines
1.2 KiB
// markdown-it plugin for generating line numbers.
|
|
// It depends on preWrapper plugin.
|
|
|
|
import type MarkdownIt from 'markdown-it'
|
|
|
|
export const lineNumberPlugin = (md: MarkdownIt, enable = false) => {
|
|
const fence = md.renderer.rules.fence!
|
|
md.renderer.rules.fence = (...args) => {
|
|
const rawCode = fence(...args)
|
|
|
|
const [tokens, idx] = args
|
|
const info = tokens[idx].info
|
|
|
|
if (
|
|
(!enable && !/:line-numbers($| )/.test(info)) ||
|
|
(enable && /:no-line-numbers($| )/.test(info))
|
|
) {
|
|
return rawCode
|
|
}
|
|
|
|
const code = rawCode.slice(
|
|
rawCode.indexOf('<code>'),
|
|
rawCode.indexOf('</code>')
|
|
)
|
|
|
|
const lines = code.split('\n')
|
|
|
|
const lineNumbersCode = [
|
|
...Array(
|
|
lines.length -
|
|
(lines[lines.length - 1] === `<span class="line"></span>` ? 1 : 0)
|
|
)
|
|
]
|
|
.map((_, index) => `<span class="line-number">${index + 1}</span><br>`)
|
|
.join('')
|
|
|
|
const lineNumbersWrapperCode = `<div class="line-numbers-wrapper" aria-hidden="true">${lineNumbersCode}</div>`
|
|
|
|
const finalCode = rawCode
|
|
.replace(/<\/div>$/, `${lineNumbersWrapperCode}</div>`)
|
|
.replace(/"(language-[^"]*?)"/, '"$1 line-numbers-mode"')
|
|
|
|
return finalCode
|
|
}
|
|
}
|