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.
vitepress/__tests__/e2e/markdown-extensions/index.md

2.9 KiB

Markdown Extensions

VitePress on GitHub

GitHub-Style Tables

Tables Are Cool
col 3 is right-aligned $1600
col 2 is centered $12
zebra stripes are neat $1

Emoji

  • 🎉
  • 💯

Table of Contents

toc

Custom Containers

Default Title

::: info This is an info box. :::

::: tip This is a tip. :::

::: warning This is a warning. :::

::: danger This is a dangerous warning. :::

::: details This is a details block. :::

Custom Title

::: danger STOP Danger zone, do not proceed :::

::: details Click me to view the code

console.log('Hello, VitePress!')

:::

Line Highlighting in Code Blocks

Single Line

export default {
  data () {
    return {
      msg: 'Highlighted!'
    }
  }
}

Multiple single lines, ranges

export default {
  data () {
    return {
      msg: `Highlighted!
      This line isn't highlighted,
      but this and the next 2 are.`,
      motd: 'VitePress is awesome',
      lorem: 'ipsum',
    }
  }
}

Comment Highlight

export default { // [!code focus]
  data() { // [!code hl]
    return {
      msg: 'Removed' // [!code --]
      msg: 'Added' // [!code ++]
      msg: 'Error', // [!code error]
      msg: 'Warning' // [!code warning]
    }
  }
}

Line Numbers

const line1 = 'This is line 1'
const line2 = 'This is line 2'

Import Code Snippets

Basic Code Snippet

<<< @/markdown-extensions/foo.md

Specify Region

<<< @/markdown-extensions/foo.md#snippet

With Other Features

<<< @/markdown-extensions/foo.md#snippet{1 ts:line-numbers} [snippet with region]

Code Groups

Basic Code Group

::: code-group

/**
 * @type {import('vitepress').UserConfig}
 */
const config = {
  // ...
}

export default config
import type { UserConfig } from 'vitepress'

const config: UserConfig = {
  // ...
}

export default config

:::

With Other Features

::: code-group

<<< @/markdown-extensions/foo.md

<<< @/markdown-extensions/foo.md#snippet{1 ts:line-numbers} [snippet with region]

:::

Markdown File Inclusion

Markdown At File Inclusion

Markdown Nested File Inclusion

Markdown File Inclusion with Range

Markdown File Inclusion with Range without Start

Markdown File Inclusion with Range without End