\r\n```\r\n\r\n```\r\n// test-2.md\r\n---\r\ntitle: ❌\r\n---\r\n\r\n\u003Cscript setup lang=\"ts\">\r\nimport { ref } from \"vue\";\r\nimport yaml from \"yaml\";\r\nimport \"uno.css\";\r\n\u003C/script>\r\n\r\n\u003CTestInfo />\r\n```\r\n\r\n```\r\n// test-3.md\r\n---\r\ntitle: ❌\r\n---\r\n\r\n\u003Cscript setup lang=\"ts\">\r\nconst data = 123;\r\n\u003C/script>\r\n\r\n\u003CTestInfo />\r\n\r\n```\r\n\r\nWhen I execute `pnpm dev`(`vitepress dev website`), accessing `/test-1`, `/test-2`, `/test-3` works fine.\r\n\r\nWhen I execute `pnpm build && pnpm preview`(`vue-tsc && vitepress build website && vitepress preview website`), visit `/test-1`, `/test-2`, `/test-3`, my custom component does not work properly and the F12 console reports `Hydration completed but contains mismatches.`.\r\n\r\n\r\n\r\n### Expected behavior\r\n\r\nWhen I add the valid `\u003Cscript>` and execute `vue-tsc && vitepress build website && vitepress preview website`, the custom components will display normally and the console will not report an error.\r\n\r\n### System Info\r\n\r\n```shell\r\nSystem:\r\n OS: Windows 10 10.0.22000\r\n CPU: (16) x64 12th Gen Intel(R) Core(TM) i5-12500H\r\n Memory: 1.13 GB / 15.73 GB\r\n Binaries:\r\n Node: 16.17.1 - C:\\Program Files\\nodejs\\node.EXE\r\n Yarn: 1.22.19 - ~\\AppData\\Roaming\\npm\\yarn.CMD\r\n npm: 8.15.0 - C:\\Program Files\\nodejs\\npm.CMD\r\n Browsers:\r\n Edge: Spartan (44.22000.120.0), Chromium (109.0.1518.78)\r\n Internet Explorer: 11.0.22000.120\r\n npmPackages:\r\n vitepress: 1.0.0-alpha.32 => 1.0.0-alpha.32\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.",[2931,2934],{"name":2932,"color":2933},"bug: pending triage","e99695",{"name":2868,"color":2869},1918,"Warn `Hydration completed but contains mismatches.` and Custom components are not rendered","2023-08-11T00:04:12Z","https://github.com/vuejs/vitepress/issues/1918",0.75553477,{"description":2941,"labels":2942,"number":2944,"owner":2871,"repository":2872,"state":2915,"title":2945,"updated_at":2946,"url":2947,"score":2948},"### Is your feature request related to a problem? Please describe.\n\nFor my theme which extends the default theme, I want to have a contact page with a custom layout.\n\n### Describe the solution you'd like\n\n###### Users\r\n\r\n```markdown\r\n---\r\nlayout: contact\r\n---\r\n\r\n# Contact\r\n\r\ncontent\r\n```\r\n\r\n###### Devs\r\n\r\nEffectively add custom blocks here\r\n\r\nhttps://github.com/vuejs/vitepress/blob/c30e758585ef512eef68b33918832d4413839e9c/src/client/theme-default/components/VPContent.vue#L29-L52\r\n\r\nFor example\r\n\r\n```vue\r\n\u003CMyContact v-if=\"frontmatter.layout === 'contact'\">\r\n \u003C!-- define slots for this layout, if any -->\r\n\u003C/MyContact>\r\n```\r\n\r\n---\r\n\r\nThis needs a lot of consideration, but I might propose something like\r\n\r\n```typescript\r\nimport Contact from \"./components/MyContact.vue\";\r\n\r\nexport default \u003CTheme>{\r\n // ...\r\n customLayouts: {\r\n contact: Contact,\r\n },\r\n};\r\n```\r\n\r\nThen in VPContent,\r\n\r\n```vue\r\n\u003Ccomponent v-else-if=\"customLayouts[frontmatter.layout]\" :is=\"customLayouts[frontmatter.layout]\">\u003C/component>\r\n```\n\n### Describe alternatives you've considered\n\n- Override the VPContent component - very fragile coupling\r\n- Use the page layout with a custom frontmatter key under which additional layouts can be specified - cannot control `Content`, workaround hack\r\n\r\n###### Users\r\n\r\n```markdown\r\n---\r\nlayout: page\r\ntype: contact\r\n---\r\n\r\n# Contact\r\n\r\ncontent\r\n```\r\n\r\n###### Devs\r\n\r\n*MyLayout.vue*\r\n\r\n```vue\r\n\u003Ctemplate>\r\n \u003CLayout>\r\n \u003Ctemplate v-if=\"frontmatter.type === 'about'\" #page-top>\r\n about page top\r\n \u003C/template>\r\n \u003Ctemplate v-if=\"frontmatter.type === 'about'\" #page-bottom>\r\n about page bottom\r\n \u003C/template>\r\n\r\n \u003Ctemplate v-if=\"frontmatter.type === 'contact'\" #page-top>\r\n contact page top\r\n \u003C/template>\r\n \u003Ctemplate v-if=\"frontmatter.type === 'contact'\" #page-bottom>\r\n contact page bottom\r\n \u003C/template>\r\n \u003C/Layout>\r\n\u003C/template>\r\n```\r\n\r\n```\r\nAn element cannot have multiple '\u003Ctemplate>' elements which are distributed to the same slot.eslint[vue/valid-v-slot](https://eslint.vuejs.org/rules/valid-v-slot.html)\r\n```\r\n\r\nOR\r\n\r\n```vue\r\n\u003Ctemplate>\r\n \u003CLayout>\r\n \u003Ctemplate #page-top>\r\n \u003Ctemplate v-if=\"frontmatter.type === 'about'\">\r\n about page top\r\n \u003C/template>\r\n \u003Ctemplate v-if=\"frontmatter.type === 'contact'\">\r\n contact page top\r\n \u003C/template>\r\n \u003C/template>\r\n\r\n \u003Ctemplate #page-bottom>\r\n \u003Ctemplate v-if=\"frontmatter.type === 'about'\">\r\n about page bottom\r\n \u003C/template>\r\n \u003Ctemplate v-if=\"frontmatter.type === 'contact'\">\r\n contact page bottom\r\n \u003C/template>\r\n \u003C/template>\r\n \u003C/Layout>\r\n\u003C/template>\r\n```\r\n\r\n(Terrible maintainability)\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.dev).\n- [X] Read the [Contributing Guidelines](https://github.com/vuejs/vitepress/blob/main/.github/contributing.md).\n- [X] Check that there isn't already an issue that asks for the same feature to avoid creating a duplicate.",[2943],{"name":2893,"color":2894},2547,"Provide a way for extending themes to add layouts","2023-08-14T00:04:21Z","https://github.com/vuejs/vitepress/issues/2547",0.7637863,{"description":2950,"labels":2951,"number":2955,"owner":2871,"repository":2872,"state":2915,"title":2956,"updated_at":2957,"url":2958,"score":2959},"测试代码如下:\n````\n```js\nexport default {\n foo: { // [!code ++]\n // 这是一些注释 \n bar:'test' // [!code ++]\n }, // [!code ++]\n};\n```\n````\n效果展示\n\n\n\n此时,如果我们也想要注释的那一行也拥有高亮着色效果,我们还需要在注释的后面再补充一个注释符号`//`才有效果\n````\n```js\nexport default {\n foo: { // [!code ++]\n // 这是一些注释 // [!code ++]\n bar:'test' // [!code ++]\n }, // [!code ++]\n};\n```\n````\n\n\n\n主要讨论的是,如果已经是注释了,是否可以直接在末尾添加`[!code ++]`就可以达到上面相同的效果\n````\n```js\nexport default {\n foo: { // [!code ++]\n // 这是一些注释 [!code ++]\n bar:'test' // [!code ++]\n }, // [!code ++]\n};\n```\n````\n\n\n这算不算是一个可以优化的点?希望一起讨论一下\n\n\n",[2952],{"name":2953,"color":2954},"upstream","BF29ED",4614,"讨论:对于已经是注释的行的代码差异标记是否应该不再需要再添加多余的注释标记?","2025-03-17T04:44:40Z","https://github.com/vuejs/vitepress/issues/4614",0.76574206,{"description":2961,"labels":2962,"number":2964,"owner":2871,"repository":2872,"state":2915,"title":2965,"updated_at":2966,"url":2967,"score":2968},"### Describe the bug\n\n\r\n\r\n\n\n### Reproduction\n\n1\n\n### Expected behavior\n\n1\n\n### System Info\n\n```shell\n1\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.",[2963],{"name":2932,"color":2933},1818,"markdown parse bug","2023-01-28T00:04:04Z","https://github.com/vuejs/vitepress/issues/1818",0.7716319,["Reactive",2970],{},["Set"],["ShallowReactive",2973],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fg4EK97tjmXVpCcMWHzywpCDz-WlVCXXoUN4W_r05tV8":-1},"/vuejs/vitepress/570"]