\n\n\u003Cimg width=\"376\" height=\"181\" alt=\"Image\" src=\"https://github.com/user-attachments/assets/2f33e227-2f78-4d2d-a90e-796eb5842643\" />\n\n### Reproduction\n\nUse the default tempalte \"no style\" and add a code block with line-numbers.\n\nTested version: \"vitepress\": \"^1.6.3\"\n\n### Expected behavior\n\nThe line numbers are next to the code.\n\n### System Info\n\n```Text\nSystem:\n OS: Windows 10 10.0.19045\n CPU: (16) x64 AMD Ryzen 7 5800X3D 8-Core Processor\n Memory: 11.37 GB / 31.92 GB\n Binaries:\n Node: 22.3.0 - C:\\Program Files\\nodejs\\node.EXE\n Yarn: 1.22.17 - ~\\AppData\\Roaming\\npm\\yarn.CMD\n npm: 9.8.1 - C:\\Program Files\\nodejs\\npm.CMD\n Browsers:\n Chrome: 138.0.7204.169\n Edge: Chromium (136.0.3240.92)\n Internet Explorer: 11.0.19041.5794\n npmPackages:\n vitepress: ^1.6.3 => 1.6.3\n```\n\n### Additional context\n\nTested on Chrome, Edge and Firefox - all have the same issue.\n\n### Validations\n\n- [x] Check if you're on the [latest VitePress version](https://github.com/vuejs/vitepress/releases/latest).\n- [x] Follow our [Code of Conduct](https://vuejs.org/about/coc.html)\n- [x] Read the [docs](https://vitepress.dev).\n- [x] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.",[3034],{"name":3021,"color":3022},4865,"closed","markdown :line-numbers","2025-07-29T22:58:24Z","https://github.com/vuejs/vitepress/issues/4865",0.6590938,{"description":3042,"labels":3043,"number":3047,"owner":3024,"repository":3025,"state":3036,"title":3048,"updated_at":3049,"url":3050,"score":3051},"### Describe the bug\n\nAccording to [the configuration option](https://vitepress.vuejs.org/config/app-configs.html#markdown) of the documentation, this option is enabled:\r\n\r\n```ts\r\n// .vitepress/config.ts\r\nexport default defineConfig({\r\n // ...\r\n markdown: {\r\n lineNumbers: true,\r\n },\r\n // ...\r\n})\r\n```\r\n\r\nNot getting the expected result showing line numbers , by the way, the code snippets of the documentation also have no line numbers:\r\n\r\n\r\n\r\n\n\n### Reproduction\n\n```ts\r\n// .vitepress/config.ts\r\nexport default defineConfig({\r\n // ...\r\n markdown: {\r\n lineNumbers: true,\r\n },\r\n // ...\r\n})\r\n```\n\n### Expected behavior\n\nShow the code line numbers.\r\n\r\n\r\n\n\n### System Info\n\n```shell\nSystem:\r\n OS: Windows 10 10.0.19044\r\n CPU: (12) x64 Intel(R) Core(TM) i5-10400F CPU @ 2.90GHz\r\n Memory: 8.46 GB / 15.91 GB\r\n Binaries:\r\n Node: 16.15.0 - D:\\Programs\\nodejs\\node.EXE\r\n Yarn: 1.22.18 - ~\\AppData\\Roaming\\npm\\yarn.CMD\r\n npm: 8.11.0 - D:\\Programs\\nodejs\\npm.CMD\r\n Browsers:\r\n Edge: Spartan (44.19041.1266.0), Chromium (103.0.1264.62)\r\n Internet Explorer: 11.0.19041.1202\r\n npmPackages:\r\n vitepress: ^1.0.0-alpha.4 => 1.0.0-alpha.4\n```\n\n\n### Additional context\n\n_No response_\n\n### Validations\n\n- [X] Follow our [Code of Conduct](https://vuejs.org/about/coc.html)\n- [X] Read the [docs](https://vitepress.vuejs.org).\n- [X] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.",[3044],{"name":3045,"color":3046},"need more info","bdbefc",1046,"markdown.lineNumbers doesn't work under default theme","2023-01-21T14:30:12Z","https://github.com/vuejs/vitepress/issues/1046",0.6715019,{"description":3053,"labels":3054,"number":3055,"owner":3024,"repository":3025,"state":3036,"title":3056,"updated_at":3057,"url":3058,"score":3059},"### Describe the bug\n\nThe line highlighting features are broke now in the official vitepress documentation: \u003Chttps://vitepress.vuejs.org/guide/markdown.html#line-highlighting-in-code-blocks>\n\n### Reproduction\n\nOpen \u003Chttps://vitepress.vuejs.org/guide/markdown.html#line-highlighting-in-code-blocks> and discover the lines are not highlighted:\r\n\r\n\r\n\r\nCan also be reproduced locally with:\r\n\r\n```shell\r\n$ mkdir vtprs && cd vtprs\r\n$ yarn init\r\n$ yarn add --dev vitepress\r\n```\r\n\r\nWrite some code blocks with lines highlighted in `docs/index.md`, like\r\n\u003Cpre>\r\n```toml{2}\r\n[highlight]\r\nnot_highlighted = true\r\npublic = false\r\n```\r\n\u003C/pre>\r\n\r\nrun `yarn vitepress dev docs` and discover that second line is not highlighted as expected.\n\n### Expected behavior\n\nCode lines are highlighted with minimal setup.\n\n### System Info\n\n```shell\nSystem:\r\n OS: Linux 5.14 Arch Linux\r\n CPU: (16) x64 Intel(R) Core(TM) i7-10700 CPU @ 2.90GHz\r\n Memory: 5.12 GB / 15.49 GB\r\n Container: Yes\r\n Shell: 5.8 - /usr/bin/zsh\r\n Binaries:\r\n Node: 14.17.4 - /sbin/node\r\n Yarn: 1.22.15 - /sbin/yarn\r\n npm: 7.24.2 - /sbin/npm\r\n Browsers:\r\n Chromium: 94.0.4606.71\r\n Firefox: 93.0\r\n npmPackages:\r\n vitepress: ^0.19.2 => 0.19.2\n```\n\n\n### Additional context\n\n_No response_\n\n### Validations\n\n- [X] Follow our [Code of Conduct](https://vuejs.org/coc)\n- [X] Read the [docs](https://vitepress.vuejs.org/).\n- [X] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.",[],408,"Line Highlighting in Code Blocks breaks in v0.19.2","2023-01-21T16:20:27Z","https://github.com/vuejs/vitepress/issues/408",0.6733218,{"description":3061,"labels":3062,"number":3066,"owner":3024,"repository":3025,"state":3036,"title":3067,"updated_at":3068,"url":3069,"score":3070},"### Describe the bug\r\n\r\nhttps://github.com/vuejs/vitepress/blob/75ca9e4302c65e3bcc9518f7df928318380f6cf6/src/node/markdown/plugins/highlightLines.ts#L30\r\n\r\n`highlightLinePlugin` is used before `attrs`, and `token.info` is rewritten.\r\n\r\nvia https://github.com/vuejs/vitepress/pull/664#discussion_r902203459\r\n\r\n### Reproduction\r\n\r\n\u003Cimg width=\"177\" alt=\"image\" src=\"https://user-images.githubusercontent.com/8336744/174726207-1c068f94-f597-4d5e-9101-4709a08a60c3.png\">\r\n\r\n\u003Cimg width=\"299\" alt=\"image\" src=\"https://user-images.githubusercontent.com/8336744/174726233-83967c42-db47-4c12-8dbd-0c83a817c448.png\">\r\n\r\n\r\n### Expected behavior\r\n\r\nRender `data=\"asdf\"`\r\n\r\n### System Info\r\n\r\n```shell\r\nSystem:\r\n OS: macOS 13.0\r\n CPU: (10) arm64 Apple M1 Max\r\n Memory: 13.84 GB / 64.00 GB\r\n Shell: 5.8.1 - /bin/zsh\r\n Binaries:\r\n Node: 16.15.1 - ~/Library/Caches/fnm_multishells/95455_1655742557079/bin/node\r\n Yarn: 1.22.19 - ~/Library/Caches/fnm_multishells/95455_1655742557079/bin/yarn\r\n npm: 8.12.1 - ~/Library/Caches/fnm_multishells/95455_1655742557079/bin/npm\r\n Browsers:\r\n Chrome: 102.0.5005.115\r\n Firefox: 101.0.1\r\n Safari: 16.0\r\n npmPackages:\r\n vitepress: ^1.0.0-alpha.2 => 1.0.0-alpha.2\r\n```\r\n\r\n\r\n### Additional context\r\n\r\n_No response_\r\n\r\n### Validations\r\n\r\n- [X] Follow our [Code of Conduct](https://vuejs.org/about/coc.html)\r\n- [X] Read the [docs](https://vitepress.vuejs.org).\r\n- [X] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.",[3063],{"name":3064,"color":3065},"stale","ededed",826,"support adding attributes to code blocks","2023-08-11T00:04:28Z","https://github.com/vuejs/vitepress/issues/826",0.69096875,{"description":3072,"labels":3073,"number":3075,"owner":3024,"repository":3025,"state":3036,"title":3076,"updated_at":3077,"url":3078,"score":3079},"### Describe the bug\n\nI noticed that certain Markdown extensions for code blocks do not work as expected in VitePress when using the **templ** language, while they work properly for other languages like **js**. Specifically:\n\n- **Not Working Properly**:\n - Focus in Code Blocks\n - Colored Diffs in Code Blocks\n - Errors and Warnings in Code Blocks\n- **Working as Expected**:\n - Line Highlighting in Code Blocks\n\nThanks\n\n\n\n### Reproduction\n\nhttps://stackblitz.com/edit/vite-4gtyqrtf?file=docs%2Findex.md\n\nVisit the demo page by clicking the _MD Extensions Issue with Templ_ button on the homepage.\n\n\n### Expected behavior\n\nAll supported Markdown extensions for code blocks should render correctly, regardless of the specified language, as long as the language is supported by shiki. Since `templ` is a supported language, these extensions should work as expected, similar to how Line Highlighting currently works.\n\n### System Info\n\n```Text\nSystem:\n OS: macOS 15.2\n CPU: (8) arm64 Apple M3\n Memory: 434.31 MB / 24.00 GB\n Shell: 5.9 - /bin/zsh\n Binaries:\n Node: 20.18.1 - ~/.nvm/versions/node/v20.18.1/bin/node\n npm: 10.8.2 - ~/.nvm/versions/node/v20.18.1/bin/npm\n pnpm: 9.15.4 - ~/Library/pnpm/pnpm\n Browsers:\n Chrome: 131.0.6778.267\n Safari: 18.2\n npmPackages:\n vitepress: ^1.6.3 => 1.6.3\n```\n\n### Additional context\n\n_No response_\n\n### Validations\n\n- [x] Check if you're on the [latest VitePress version](https://github.com/vuejs/vitepress/releases/latest).\n- [x] Follow our [Code of Conduct](https://vuejs.org/about/coc.html)\n- [x] Read the [docs](https://vitepress.dev).\n- [x] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.",[3074],{"name":3021,"color":3022},4515,"Markdown Extensions for Code Blocks Not Working Properly with ‘templ’ Language","2025-02-01T04:42:48Z","https://github.com/vuejs/vitepress/issues/4515",0.6920388,{"description":3081,"labels":3082,"number":3084,"owner":3024,"repository":3025,"state":3036,"title":3085,"updated_at":3086,"url":3087,"score":3088},"### Describe the bug\r\n\r\nHi 👋🏻 \r\n\r\nI really liked the features like [Colored diff in code block](https://vitepress.dev/guide/markdown#colored-diffs-in-code-blocks) when introduced along with another features like code block focus mode.\r\n\r\nHowever, I was unable to use these features in Anu docs and today I also tried the same in my company's product documentaion but VitePress is unable to produce expected result.\r\n\r\nIf we grab the code snippet from official docs for \"Colored diff in code block\" our project's code snippet doesn't look same as VitePress's.\r\n\r\n### Reproduction\r\n\r\nhttps://stackblitz.com/edit/vite-fiz6gv?file=docs/example.md\r\n\r\n### Expected behavior\r\n\r\nCode block should look like as shown in VitePress site:\r\n\r\n\r\nHow it looks:\r\n\r\n\r\n\r\n### System Info\r\n\r\n```shell\r\nSystem:\r\n OS: macOS 13.2.1\r\n CPU: (8) arm64 Apple M1\r\n Memory: 82.20 MB / 8.00 GB\r\n Shell: 5.8.1 - /bin/zsh\r\n Binaries:\r\n Node: 18.15.0 - ~/.nvm/versions/node/v18.15.0/bin/node\r\n Yarn: 1.22.19 - ~/.nvm/versions/node/v18.15.0/bin/yarn\r\n npm: 9.5.0 - ~/.nvm/versions/node/v18.15.0/bin/npm\r\n Browsers:\r\n Chrome: 112.0.5615.137\r\n Firefox: 112.0\r\n Safari: 16.3\r\n npmPackages:\r\n vitepress: 1.0.0-alpha.73 => 1.0.0-alpha.73\r\n```\r\n\r\n\r\n### Additional context\r\n\r\nNone\r\n\r\n### Validations\r\n\r\n- [X] Follow our [Code of Conduct](https://vuejs.org/about/coc.html)\r\n- [X] Read the [docs](https://vitepress.dev).\r\n- [X] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.",[3083],{"name":3021,"color":3022},2282,"🐞 Syntax highlighting using inline comment features aren't working","2023-05-02T00:04:03Z","https://github.com/vuejs/vitepress/issues/2282",0.69368976,{"description":3090,"labels":3091,"number":3092,"owner":3024,"repository":3025,"state":3036,"title":3093,"updated_at":3094,"url":3095,"score":3096},"\u003C!--\r\nNOTE:\r\nVitePress is still WIP, and it is not compatible with VuePress.\r\nPlease do not open issue about default theme missing features or something doesn't work like VuePress.\r\n-->\r\n\r\n**Describe the bug**\r\nWhen creating a code block using line highlighting, it does not highlight the correct line. Instead it seems to highlight the line between the desired line and the previous line.\r\n\r\n**To Reproduce**\r\nSteps to reproduce the behavior:\r\n\r\nCreate a new vitepress project. In any markdown page create a codeblock and specify the line to highlight. Check the output and the correct line will not be highlighted.\r\n\r\nExample:\r\n\r\n```md\r\n## Usage\r\n```html{3}\r\n\u003Ctemplate>\r\n \u003Cdiv>\r\n \u003Ckro-button @click=\"delete\">Delete Cake\u003C/kro-button>\r\n \u003C/div>\r\n\u003C/template>\r\n\r\n\u003Cscript setup>\r\n import { useDialog } from '@black-kro/ui';\r\n\r\n const { createDialog } = useDialog();\r\n\r\n export const delete = () => {\r\n createDialog({\r\n title: 'Delete Cake?',\r\n message: 'Are you sure you would like to delete the cake?',\r\n })\r\n .then(() => {\r\n // Delete Cake.\r\n })\r\n .catch(() => {\r\n // Don't delete Cake.\r\n })\r\n }\r\n\u003C/script>\r\n```\r\n\r\nOutput:\r\n\r\n\r\n**Expected behavior**\r\nLine 3 should be highlighted.\r\n\r\n**System Info**\r\n- vitepress version: 0.5.0\r\n- vite version: 1.0.0-rc.3\r\n- Node version: 14.7.0\r\n- OS version: Windows 10\r\n",[],63,"Code block line highlighting not highlighting correct line","2023-01-21T16:22:16Z","https://github.com/vuejs/vitepress/issues/63",0.6985373,{"description":3098,"labels":3099,"number":3103,"owner":3024,"repository":3025,"state":3036,"title":3104,"updated_at":3105,"url":3106,"score":3107},"### Describe the bug\r\n\r\nwhen i use code theme. include `light` and `dark` mode\r\nThe code block repeat render\r\n\r\n\u003Cimg width=\"793\" alt=\"image\" src=\"https://user-images.githubusercontent.com/40693636/198177946-e57e0594-5c23-4e78-96d3-5100b01f51e5.png\">\r\n\r\n\r\n### Reproduction\r\n\r\n```js\r\n// config.ts\r\nmarkdown: {\r\n headers: {\r\n level: [0, 0]\r\n },\r\n theme: {\r\n light: 'vitesse-light',\r\n dark: 'vitesse-dark'\r\n }\r\n },\r\n```\r\n\r\n### Expected behavior\r\n\r\nThe code block only render once\r\n\r\n### System Info\r\n\r\n```shell\r\nSystem:\r\n OS: macOS 12.6\r\n CPU: (8) arm64 Apple M1 Pro\r\n Memory: 311.92 MB / 16.00 GB\r\n Shell: 5.8.1 - /bin/zsh\r\n Binaries:\r\n Node: 18.11.0 - /opt/homebrew/bin/node\r\n Yarn: 1.22.19 - /opt/homebrew/bin/yarn\r\n npm: 8.19.2 - /opt/homebrew/bin/npm\r\n Browsers:\r\n Chrome: 107.0.5304.62\r\n Safari: 15.6.1\r\n```\r\n\r\n\r\n### Additional context\r\n\r\n_No response_\r\n\r\n### Validations\r\n\r\n- [X] Follow our [Code of Conduct](https://vuejs.org/about/coc.html)\r\n- [X] Read the [docs](https://vitepress.vuejs.org).\r\n- [X] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.",[3100],{"name":3101,"color":3102},"build","377ba8",1545,"Code block repeat render !","2023-01-21T14:22:57Z","https://github.com/vuejs/vitepress/issues/1545",0.7014068,{"description":3109,"labels":3110,"number":3112,"owner":3024,"repository":3025,"state":3036,"title":3113,"updated_at":3114,"url":3115,"score":3116},"### Describe the bug\n\nI found in `vue-html` code blocks + line number mode, there is no `line-numbers-mode` CSS class on the div wrapper, which leads to the layout bug like below:\r\n\r\n\r\n\r\n\r\n\n\n### Reproduction\n\n`index.md`:\r\n\r\n```\r\n\\```html\r\n\u003Cdiv id=\"event-handling\">\r\n \u003Cp>{{ message }}\u003C/p>\r\n \u003Cbutton v-on:click=\"reverseMessage\">Reverse Message\u003C/button>\r\n\u003C/div>\r\n\\```\r\n\r\n\\```vue-html\r\n\u003Cdiv id=\"event-handling\">\r\n \u003Cp>{{ message }}\u003C/p>\r\n \u003Cbutton v-on:click=\"reverseMessage\">Reverse Message\u003C/button>\r\n\u003C/div>\r\n\\```\r\n```\r\n\r\n`.vitepress/config.js`:\r\n\r\n```\r\nmodule.exports = () => ({\r\n markdown: {\r\n lineNumbers: true\r\n }\r\n})\r\n```\n\n### Expected behavior\n\nBy manually adding the CSS class in devtools, it goes normal.\r\n\r\n\r\n\r\n\r\n\n\n### System Info\n\n```shell\nSystem:\r\n OS: macOS 13.0\r\n CPU: (8) arm64 Apple M1\r\n Memory: 130.56 MB / 8.00 GB\r\n Shell: 5.8.1 - /bin/zsh\r\n Binaries:\r\n Node: 16.14.2 - ~/.nvm/versions/node/v16.14.2/bin/node\r\n Yarn: 1.22.18 - ~/.yarn/bin/yarn\r\n npm: 8.5.0 - ~/.nvm/versions/node/v16.14.2/bin/npm\r\n Browsers:\r\n Chrome: 103.0.5060.134\r\n Safari: 16.0\r\n npmPackages:\r\n vitepress: 1.0.0-alpha.4 => 1.0.0-alpha.4\n```\n\n\n### Additional context\n\n_No response_\n\n### Validations\n\n- [X] Follow our [Code of Conduct](https://vuejs.org/about/coc.html)\n- [X] Read the [docs](https://vitepress.vuejs.org).\n- [X] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.",[3111],{"name":3101,"color":3102},1105,"The layout of vue-html code block in line number mode","2023-01-21T14:28:55Z","https://github.com/vuejs/vitepress/issues/1105",0.70474255,["Reactive",3118],{},["Set"],["ShallowReactive",3121],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fLQUSo8yNpCecI_WBfItP8EEv7j_n65WPcJIKF4vK9yo":-1},"/vuejs/vitepress/2567"]