\r\n```\r\n\r\nAlternatively, use the `desc` defined in the `container` to write Markdown syntax.\r\n\r\n```md\r\n::: demo src=\"../demo.vue\" title=\"Demo block\"\r\n\r\nThis is a `description` that can be written using Markdown.\r\n\r\n:::\r\n```\r\n\r\n### Describe the solution you'd like\r\n\r\nTo address this, I have created the [markdown-it-vitepress-demo](https://github.com/hairyf/markdown-it-vitepress-demo) plugin. I'm not sure if it can be helpful.\r\n\r\n### Describe alternatives you've considered\r\n\r\n_No response_\r\n\r\n### Additional context\r\n\r\n- https://github.com/vuejs/vitepress/issues/987\r\n- https://github.com/vuejs/vitepress/issues/1349\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] Read the [Contributing Guidelines](https://github.com/vuejs/vitepress/blob/main/.github/contributing.md).\r\n- [X] Check that there isn't already an issue that asks for the same feature to avoid creating a duplicate.",[2879],{"name":2866,"color":2867},2432,"feat(demo): built-in markdown plugin provides support for showcasing demo capabilities.","2024-07-17T14:37:26Z","https://github.com/vuejs/vitepress/issues/2432",0.7411531,{"description":2886,"labels":2887,"number":2888,"owner":2869,"repository":2870,"state":2889,"title":2890,"updated_at":2891,"url":2892,"score":2893},"Here's the vitepress project: https://github.com/grammyjs/grammy\r\n\r\nI'm creating `/site/docs/.vuepress/components/SomeComponent.vue` and trying to import it in `/site/docs/guide/README.md` this way:\r\n\r\n```html\r\n\u003Cscript setup>\r\n import SomeComponent from '../components/SomeComponent.vue'\r\n\u003C/script>\r\n```\r\n\r\nBut I'm getting this:\r\n\r\n\r\n\r\nHow should the custom component be imported?",[],535,"closed","How should one import an SFC in a markdown file?","2023-01-21T16:20:07Z","https://github.com/vuejs/vitepress/issues/535",0.6983147,{"description":2895,"labels":2896,"number":2900,"owner":2869,"repository":2870,"state":2889,"title":2901,"updated_at":2902,"url":2903,"score":2904},"I am looking into porting the using vue in Markdown from vuepress: \r\nhttps://vuepress.vuejs.org/guide/using-vue.html\r\n\r\nIf I understand correctly, vitepress doesn't want to auto register components by convention as Vuepress does. Is this the case? I actually liked this feature, but I understand that vitepress wants to keep the moving parts as small as possible.\r\n\r\nWhat is the recommended way to register the components? I see that in vue-router-next docs they are registered globally inside `enhanceApp`: https://github.com/vuejs/vue-router-next/search?q=HomeSponsors.\r\nSame as with this comment: https://github.com/vuejs/vitepress/issues/92#issuecomment-724645482\r\n\r\nShould we document this way in the docs?\r\n\r\nSome thoughts about this. It would be great that users that want to use the default theme as is, do not need to learn straight away about enhanceApp to be able to use a vue component in their markdown.\r\n\r\nIf auto registering by convention in a folder like `.vitepress/components` is not an option, could we import them directly in the markdown?\r\n\r\n```markdown\r\n# Docs\r\n\r\nThis is a .md using a custom component\r\n\r\n\u003CCustomComponent />\r\n\r\n## More docs\r\n\r\n...\r\n\r\n\u003Cscript setup>\r\n import CustomComponent from '../components/CustomComponent.vue'\r\n\u003C/script>\r\n```\r\n\r\nScript & style hoisting is working in vitepress: https://vuepress.vuejs.org/guide/using-vue.html#script-style-hoisting, but I tried this example to import a Component and it is not at this point.\r\n",[2897],{"name":2898,"color":2899},"docs","0075ca",157,"Recommended way to use Custom Vue components in .md","2023-01-21T16:04:10Z","https://github.com/vuejs/vitepress/issues/157",0.7100263,{"description":2906,"labels":2907,"number":1222,"owner":2869,"repository":2870,"state":2889,"title":2911,"updated_at":2912,"url":2913,"score":2914},"Hello!\r\n\r\nDocumentation says \"...allowing the user to freely mix Vue components inside markdown content...\" but it doesn't work as VuePress.\r\n\r\nTo reproduce init project according to documentation.\r\nCreate `.vitepress/components/NewComponent.vue` with a `\u003Ctemplate>\u003Cp>Hello VitePress\u003C/p>\u003C/template>`\r\nTry to use `\u003CNewComponent />` inside index.md\r\n\r\nExpected to see rendered component on the page see nothing.\r\nConsole says \"Failed to resolve component: NewComponent\"\r\n\r\nWhat I'm doing wrong? ",[2908],{"name":2909,"color":2910},"question","5D5FAE","Cant figure out how to use components inside .md file","2023-01-21T16:24:22Z","https://github.com/vuejs/vitepress/issues/101",0.71952945,{"description":2916,"labels":2917,"number":2921,"owner":2869,"repository":2870,"state":2889,"title":2922,"updated_at":2923,"url":2924,"score":2925},"### Describe the bug\r\n\r\nHi, I am trying to import and use a custom Markdown renderer inside a component but it looks like the `createMarkdownRenderer` function is not exported.\r\n\r\n```\r\nUncaught SyntaxError: The requested module '/@fs/Users/xyz/.github/xyz/node_modules/vitepress/dist/client/index.js?v=61ac765b' does not provide an export named 'createMarkdownRenderer' (at EndpointExample.vue:2:10)\r\n```\r\n\r\nHowever, according to TypeScript types exported from VitePress, `createMarkdownRenderer` should be available for use.\r\n\r\n### Reproduction\r\n\r\n```vue\r\n\u003Cscript setup lang=\"ts\">\r\nimport { createMarkdownRenderer } from \"vitepress\";\r\n\r\nconst props = defineProps\u003C{\r\n requests: { type: string; content: string; }[];\r\n response: string;\r\n}>();\r\n\r\n// `createMarkdownRenderer` is not exported from vitepress.\r\nconst md = await createMarkdownRenderer(\".\");\r\nconst response = md.render(props.response);\r\n\u003C/script>\r\n```\r\n\r\n### Expected behavior\r\n\r\nThe function `createMarkdownRenderer` should be exported as it is available from TypeScript types. If it should not, then remove the `createMarkdownRenderer` type export.\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: 116.75 MB / 16.00 GB\r\n Shell: 5.8.1 - /bin/zsh\r\n Binaries:\r\n Node: 18.12.1 - ~/.nvm/versions/node/v18.12.1/bin/node\r\n Yarn: 1.22.19 - ~/.yarn/bin/yarn\r\n npm: 8.19.2 - ~/.nvm/versions/node/v18.12.1/bin/npm\r\n Browsers:\r\n Brave Browser: 108.1.46.144\r\n Chrome: 108.0.5359.124\r\n Firefox: 103.0.2\r\n Safari: 16.0\r\n```\r\n\r\n\r\n### Additional context\r\n\r\nPlease note that I am trying to create a custom `markdownRenderer` so that I can create a code render from my component props.\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.",[2918],{"name":2919,"color":2920},"bug: pending triage","e99695",1752,"The requested module does not provide an export named 'createMarkdownRenderer'","2023-01-21T14:16:58Z","https://github.com/vuejs/vitepress/issues/1752",0.721403,{"description":2927,"labels":2928,"number":2929,"owner":2869,"repository":2870,"state":2889,"title":2930,"updated_at":2931,"url":2932,"score":2933},"### Is your feature request related to a problem? Please describe.\n\n目前只能引入.vue文件进行解析,引入tsx会报`React is not defined`\n\n### Describe the solution you'd like\n\n能够支持tsx\r\n或者放开vite的配置,能够对vite做扩展支持\n\n### Describe alternatives you've considered\n\n_No response_\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] 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.",[],1636,"希望能够支持tsx组件","2023-01-21T14:20:38Z","https://github.com/vuejs/vitepress/issues/1636",0.72219336,{"description":2935,"labels":2936,"number":2940,"owner":2869,"repository":2870,"state":2889,"title":2941,"updated_at":2942,"url":2943,"score":2944},"### Describe the bug\n\nI referenced a globally registered component in the markdown document of vitepress. When I used it, the error was reported as follows:\r\n**[vitepress] Internal server error: At least one \u003Ctemplate> or \u003Cscript> is required in a single file component.**\r\n\r\n\r\n\n\n### Reproduction\n\nCreate vite.config.js in the vitepress root directory, the content is as follows:\r\n\r\n```\r\nimport { defineConfig } from \"vite\";\r\nimport vueJsx from \"@vitejs/plugin-vue-jsx\";\r\nimport vue from \"@vitejs/plugin-vue\"\r\nexport default defineConfig({\r\n plugins: [\r\n vue(),\r\n vueJsx(),\r\n ],\r\n});\r\n```\n\n### Expected behavior\n\nRender component content correctly\n\n### System Info\n\n```shell\nnode 16\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.dev).\n- [X] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.",[2937],{"name":2938,"color":2939},"need more info","bdbefc",2095,"vitepress not support jsx file?","2023-03-29T00:04:14Z","https://github.com/vuejs/vitepress/issues/2095",0.7222791,{"description":2946,"labels":2947,"number":2948,"owner":2869,"repository":2870,"state":2889,"title":2949,"updated_at":2950,"url":2951,"score":2952},"### Is your feature request related to a problem? Please describe.\n\nI'm working on a vitepress site that uses a custom theme. Some time ago, another contributor added local search to the site.\r\nHe did this by enabling search in the config and then importing the `VPNavBarSearch` from `vitepress/dist/client/theme-default/components/VPNavBarSearch.vue`\r\n\r\nThis works. However, I don't believe it's best practice. The thing that is particularly annoying is that it generates a bunch of typescript errors and I'm hoping to get my docs build to be typescript clean and enforce that. The typescript team seems adamantly against enabling the kind of error supression that would enable this scenario and reinforces the concept that they don't believe importing *.ts files (presumably this includes *.vue files with script = \"ts\") in this issue: https://github.com/microsoft/TypeScript/issues/40426\n\n### Describe the solution you'd like\n\nOne possible solution is for VitePress to export `VPNavBarSearch` and possibly other related components.\r\nI monkey patched vitepress to export the component `VPNavBarSearch` and then added it to the normal imports from vitepress e.g. `import { ..., VPNavBarSearch, ...} from 'vitepress'` to prove to myself that this works, including getting rid of the typescript error.\n\n### Describe alternatives you've considered\n\nThe other alternative I briefly explored was moving to use the default theme with customizations, but the default Layout doesn't do everything that I'd like, even with liberal use of the slots.\r\n\r\n(Most) of the reason the typescript is complaining is that I have noexplicit any set and it looks like vitepress doesn't, so it might be possible to make the vitepress components comply with stricter typescript config and have the direct import work, but I think this is a less desireable solution, since as noted above the typescript team doesn't believe this kind of import is best practice.\n\n### Additional context\n\nI've pasted the errors I'm seeing below. If you want to reproduce them:\r\n\r\nCreate a vitepress site with a custom theme and Layout.vue file\r\nAdd the line `import VPNavBarSearch from 'vitepress/dist/client/theme-default/components/VPNavBarSearch.vue`\r\n\r\n```\r\nnode_modules/vitepress/dist/client/theme-default/components/VPAlgoliaSearchBox.vue:6:25 - error TS7016: Could not find a declaration file for module '../composables/data'. 'C:/Projects/bootstrap-vue-next/apps/docs/node_modules/vitepress/dist/client/theme-default/composables/data.js' implicitly has an 'any' type.\r\n\r\n6 import { useData } from '../composables/data'\r\n ~~~~~~~~~~~~~~~~~~~~~\r\n\r\nnode_modules/vitepress/dist/client/theme-default/components/VPLocalSearchBox.vue:2:30 - error TS2307: Cannot find module '@localSearchIndex' or its corresponding type declarations.\r\n\r\n2 import localSearchIndex from '@localSearchIndex'\r\n ~~~~~~~~~~~~~~~~~~~\r\n\r\nnode_modules/vitepress/dist/client/theme-default/components/VPLocalSearchBox.vue:13:18 - error TS7016: Could not find a declaration file for module 'mark.js/src/vanilla.js'. 'C:/Projects/bootstrap-vue-next/node_modules/.pnpm/mark.js@8.11.1/node_modules/mark.js/src/vanilla.js' implicitly has an 'any' type.\r\n Try `npm i --save-dev @types/mark.js` if it exists or add a new declaration (.d.ts) file containing `declare module 'mark.js/src/vanilla.js';`\r\n\r\n13 import Mark from 'mark.js/src/vanilla.js'\r\n ~~~~~~~~~~~~~~~~~~~~~~~~\r\n\r\nnode_modules/vitepress/dist/client/theme-default/components/VPLocalSearchBox.vue:30:28 - error TS7016: Could not find a declaration file for module '../../app/utils'. 'C:/Projects/bootstrap-vue-next/apps/docs/node_modules/vitepress/dist/client/app/utils.js' implicitly has an 'any' type.\r\n\r\n30 import { pathToFile } from '../../app/utils'\r\n ~~~~~~~~~~~~~~~~~\r\n\r\nnode_modules/vitepress/dist/client/theme-default/components/VPLocalSearchBox.vue:31:30 - error TS7016: Could not find a declaration file for module '../../shared'. 'C:/Projects/bootstrap-vue-next/apps/docs/node_modules/vitepress/dist/client/shared.js' implicitly has an 'any' type.\r\n\r\n31 import { escapeRegExp } from '../../shared'\r\n ~~~~~~~~~~~~~~\r\n\r\nnode_modules/vitepress/dist/client/theme-default/components/VPLocalSearchBox.vue:32:25 - error TS7016: Could not find a declaration file for module '../composables/data'. 'C:/Projects/bootstrap-vue-next/apps/docs/node_modules/vitepress/dist/client/theme-default/composables/data.js' implicitly has an 'any' type.\r\n\r\n32 import { useData } from '../composables/data'\r\n ~~~~~~~~~~~~~~~~~~~~~\r\n\r\nnode_modules/vitepress/dist/client/theme-default/components/VPLocalSearchBox.vue:33:26 - error TS7016: Could not find a declaration file for module '../support/lru'. 'C:/Projects/bootstrap-vue-next/apps/docs/node_modules/vitepress/dist/client/theme-default/support/lru.js' implicitly has an 'any' type.\r\n\r\n33 import { LRUCache } from '../support/lru'\r\n ~~~~~~~~~~~~~~~~\r\n\r\nnode_modules/vitepress/dist/client/theme-default/components/VPLocalSearchBox.vue:34:39 - error TS7016: Could not find a declaration file for module '../support/translation'. 'C:/Projects/bootstrap-vue-next/apps/docs/node_modules/vitepress/dist/client/theme-default/support/translation.js' implicitly has an 'any' type.\r\n\r\n34 import { createSearchTranslate } from '../support/translation'\r\n ~~~~~~~~~~~~~~~~~~~~~~~~\r\n\r\nnode_modules/vitepress/dist/client/theme-default/components/VPLocalSearchBox.vue:48:17 - error TS2339: Property 'hot' does not exist on type 'ImportMeta'.\r\n\r\n48 if (import.meta.hot) {\r\n ~~~\r\n\r\nnode_modules/vitepress/dist/client/theme-default/components/VPLocalSearchBox.vue:49:15 - error TS2339: Property 'hot' does not exist on type 'ImportMeta'.\r\n\r\n49 import.meta.hot.accept('/@localSearchIndex', (m) => {\r\n ~~~\r\n\r\nnode_modules/vitepress/dist/client/theme-default/components/VPLocalSearchBox.vue:49:49 - error TS7006: Parameter 'm' implicitly has an 'any' type.\r\n\r\n49 import.meta.hot.accept('/@localSearchIndex', (m) => {\r\n ~\r\n\r\nnode_modules/vitepress/dist/client/theme-default/components/VPNavBarSearch.vue:10:35 - error TS7016: Could not find a declaration file for module '../../shared'. 'C:/Projects/bootstrap-vue-next/apps/docs/node_modules/vitepress/dist/client/shared.js' implicitly has an 'any' type.\r\n\r\n10 import type { DefaultTheme } from '../../shared'\r\n ~~~~~~~~~~~~~~\r\n\r\nnode_modules/vitepress/dist/client/theme-default/components/VPNavBarSearch.vue:11:25 - error TS7016: Could not find a declaration file for module '../composables/data'. 'C:/Projects/bootstrap-vue-next/apps/docs/node_modules/vitepress/dist/client/theme-default/composables/data.js' implicitly has an 'any' type.\r\n\r\n11 import { useData } from '../composables/data'\r\n ~~~~~~~~~~~~~~~~~~~~~\r\n\r\nnode_modules/vitepress/dist/client/theme-default/components/VPNavBarSearch.vue:14:26 - error TS2304: Cannot find name '__VP_LOCAL_SEARCH__'.\r\n\r\n14 const VPLocalSearchBox = __VP_LOCAL_SEARCH__\r\n ~~~~~~~~~~~~~~~~~~~\r\n\r\nnode_modules/vitepress/dist/client/theme-default/components/VPNavBarSearch.vue:18:28 - error TS2304: Cannot find name '__ALGOLIA__'. \r\n\r\n18 const VPAlgoliaSearchBox = __ALGOLIA__\r\n ~~~~~~~~~~~\r\n\r\nnode_modules/vitepress/dist/client/theme-default/components/VPNavBarSearch.vue:48:8 - error TS2304: Cannot find name '__ALGOLIA__'. \r\n\r\n48 if (!__ALGOLIA__) {\r\n ~~~~~~~~~~~\r\n\r\nnode_modules/vitepress/dist/client/theme-default/components/VPNavBarSearch.vue:113:5 - error TS2304: Cannot find name '__VP_LOCAL_SEARCH__'.\r\n\r\n113 if (__VP_LOCAL_SEARCH__) {\r\n ~~~~~~~~~~~~~~~~~~~\r\n\r\nnode_modules/vitepress/dist/client/theme-default/components/VPNavBarSearch.vue:129:18 - error TS2304: Cannot find name '__ALGOLIA__'. \r\n\r\n129 const provider = __ALGOLIA__ ? 'algolia' : __VP_LOCAL_SEARCH__ ? 'local' : ''\r\n ~~~~~~~~~~~\r\n\r\nnode_modules/vitepress/dist/client/theme-default/components/VPNavBarSearch.vue:129:44 - error TS2304: Cannot find name '__VP_LOCAL_SEARCH__'.\r\n\r\n129 const provider = __ALGOLIA__ ? 'algolia' : __VP_LOCAL_SEARCH__ ? 'local' : ''\r\n ~~~~~~~~~~~~~~~~~~~\r\n\r\nnode_modules/vitepress/dist/client/theme-default/components/VPNavBarSearchButton.vue:3:39 - error TS7016: Could not find a declaration file for module '../support/translation'. 'C:/Projects/bootstrap-vue-next/apps/docs/node_modules/vitepress/dist/client/theme-default/support/translation.js' implicitly has an 'any' type.\r\n\r\n3 import { createSearchTranslate } from '../support/translation'\r\n\r\n```\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.",[],4476,"Enable use of search components in custom layouts","2025-01-17T04:43:47Z","https://github.com/vuejs/vitepress/issues/4476",0.72588515,{"description":2954,"labels":2955,"number":2957,"owner":2869,"repository":2870,"state":2889,"title":2958,"updated_at":2959,"url":2960,"score":2961},"\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\n\r\n```bash\r\n> vitepress build\r\n\r\nvitepress v0.7.3\r\nvite v1.0.0-rc.9\r\nbuilding client bundle...\r\nbuilding server bundle...\r\nrendering pages...\r\nbuild error:\r\n /*****/node_modules/vitepress/dist/client/app/temp/_assets/app.js:317\r\n nextProps[name] = ctx.slots[name]?.() ?? props[name];\r\n ^\r\n\r\nSyntaxError: Unexpected token '.'\r\n```\r\n\r\n**To Reproduce**\r\nSteps to reproduce the behavior:\r\n\r\n```typescript\r\nimport { computed, ComputedRef, SetupContext, VNode } from 'vue';\r\n\r\nexport function useReactLikeProps\u003CTProps extends Record\u003Cstring, any>>(\r\n component: any,\r\n props: TProps,\r\n ctx: SetupContext\u003Cany>,\r\n): ComputedRef\u003C\r\n TProps & {\r\n children?: VNode;\r\n }\r\n> {\r\n return computed(() => {\r\n const nextProps = { ...props };\r\n const VNodeProps: string[] = Object.keys(component.props).filter(name => {\r\n return (\r\n typeof component.props[name] === 'object' &&\r\n component.props[name].__TYPE__ === 'VNode'\r\n );\r\n });\r\n VNodeProps.forEach(name => {\r\n (nextProps as any)[name] = ctx.slots[name]?.() ?? props[name];\r\n });\r\n (nextProps as any).children = ctx.slots.default?.();\r\n return nextProps;\r\n });\r\n}\r\n```\r\n\r\n**Expected behavior**\r\nA clear and concise description of what you expected to happen.\r\n\r\n**System Info**\r\n- vitepress version: v0.7.3\r\n- vite version: v1.0.0-rc.9\r\n- Node version: v12.18.4\r\n- OS version: mac 10.15.7\r\n\r\n**Additional context**\r\nAdd any other context about the problem here.\r\n",[2956],{"name":2909,"color":2910},120,"build error: SyntaxError: Unexpected token '.'","2023-01-21T16:24:17Z","https://github.com/vuejs/vitepress/issues/120",0.72966784,["Reactive",2963],{},["Set"],["ShallowReactive",2966],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fqq54sFo0H1qm5nlJjQKP2RlB48zi0OAbMyXe22mtSlw":-1},"/vuejs/vitepress/279"]