`)\r\n\r\nI'm currently working on migrating and documenting the excellent Spectre CSS docs and am using Vitepress.\r\n\r\nI'm developing an ejected and modified default theme which has already come some way to solving this problem:\r\n\r\n- [original](https://picturepan2.github.io/spectre/components/menu.html) (custom app)\r\n- [migrated](https://spectre-org.github.io/spectre-docs/docs/components/menu.html) (VitePress with modified default theme)\r\n - note the `vp-doc` formatting which is all Spectre CSS\r\n - some fixed, and some not-yet fixed clashes of general class names\r\n\r\nFor reference to the use case (documenting a 3rd-party framework) here is the raw markdown page:\r\n\r\n- https://raw.githubusercontent.com/spectre-org/spectre-docs/main/docs/components/menu.md\r\n\r\nNote that:\r\n\r\n- Spectre CSS (or any other 3rd-party CSS framework) is now able to be simply \"dropped in\"\r\n- there is no pollution between VitePress and the 3rd-party framework\r\n- VitePress' default components remain fully-styled and work as they were before\r\n- `vp-doc` content can be safely used to demo any 3rd party HTML elements and classes\r\n\r\nI think I know enough to fix the problems in my modified theme and either:\r\n\r\n- publish a new \"neutral\" theme\r\n- port the changes to the default theme (ideal outcome)\r\n\r\nThere's actually not that much work; it's:\r\n\r\n- renaming the general component classes\r\n- moving some `vp-doc` classes to other locations\r\n- creating an additional unstyled entrypoint such as `without-formatting`\r\n\r\n### Describe alternatives you've considered\r\n\r\nPublishing the modified theme standalone, but then of course it would not benefit from ongoing updates.\r\n\r\n### Additional context\r\n\r\nI am proposing a PR in the coming weeks to integrate these updates.\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.",[2867],{"name":2868,"color":2869},"stale","ededed",3021,"vuejs","vitepress","open","Make the default theme compatible with 3rd-party CSS frameworks","2023-11-06T14:43:58Z","https://github.com/vuejs/vitepress/issues/3021",0.7357913,{"description":2879,"labels":2880,"number":2882,"owner":2871,"repository":2872,"state":2873,"title":2883,"updated_at":2884,"url":2885,"score":2886},"### Is your feature request related to a problem? Please describe.\r\n\r\nvitepress is currently not capable enough for developing component libraries. While it is fast, it lacks something. We may be able to incorporate support for component capabilities similar to `dumi` to help developers quickly develop Vue component libraries docs.\r\n\r\n```html\r\n\u003Cdemo src=\"../demo.vue\" title=\"Demo block\" desc=\"use demo\" />\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.",[2881],{"name":2868,"color":2869},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.7389649,{"description":2888,"labels":2889,"number":2890,"owner":2871,"repository":2872,"state":2891,"title":2892,"updated_at":2893,"url":2894,"score":2895},"### Is your feature request related to a problem? Please describe.\n\nBefore, I want to use the third-party component library [element-plus](https://element-plus.gitee.io/#/zh-CN) in vuepress, which can be directly in [clientAppEnhance.ts](https://v2.vuepress.vuejs.org/zh/reference/client-api.html#%E8%BF%9B%E9%98%B6%E8%83%BD%E5%8A%9B) folder for app Use(). The code is as follows:\r\n\r\n```js\r\nimport { defineClientAppEnhance } from '@vuepress/client'\r\n\r\nimport elementPlus from 'element-pus'\r\n\r\nexport default defineClientAppEnhance(({ app, router, siteData }) => {\r\n app.use(elementPlus)\r\n})\r\n```\r\n\r\nSo how do I use third-party libraries in vitepress?\n\n### Describe the solution you'd like\n\nI hope to supplement the detailed configuration of the [document](https://vitepress.vuejs.org/). Now the content of the document configuration of vitepress is too few, and it is difficult for novices to get started with vitepress\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.",[],603,"closed","How to use third-party libraries?","2023-01-21T14:28:45Z","https://github.com/vuejs/vitepress/issues/603",0.6928085,{"description":2897,"labels":2898,"number":2902,"owner":2871,"repository":2872,"state":2891,"title":2903,"updated_at":2904,"url":2905,"score":2906},"\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 I use the components directly in markdown file, It raised a waring with `vue.js:1099 [Vue warn]: Failed to resolve componen` as:\r\n\r\n\r\n\r\nDoes vitepress auto register components in `.vitepress/components`? or where can I put the `.vue` files and how to use them? thank you.\r\n\r\n**To Reproduce**\r\nSteps to reproduce the behavior:\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:\r\n- vite version:\r\n- Node version:\r\n- OS version:\r\n\r\n**Additional context**\r\nAdd any other context about the problem here.\r\n",[2899],{"name":2900,"color":2901},"bug: pending triage","e99695",60,"Is vitepress auto register components in `.vitepress/components`?","2023-01-21T16:25:31Z","https://github.com/vuejs/vitepress/issues/60",0.6996426,{"description":2908,"labels":2909,"number":2910,"owner":2871,"repository":2872,"state":2891,"title":2911,"updated_at":2912,"url":2913,"score":2914},"i want use vitepress become a ui component display website. so i import my sfc in enhanceApp. But at meantime i must config my own `Layout.vue` and `notfound.vue` component. That is not what i want. i liked defaulte theme (vuepress old player) very mush. \r\n\r\n```js\r\nimport Layout from '/@theme/Layout.vue';\r\nimport Helloworld from \"../components/index\"\r\n\r\nexport default {\r\n Layout,\r\n // NotFound,\r\n enhanceApp({ app, router, siteData }) {\r\n app.use(Helloworld) \r\n }\r\n}\r\n```\r\n\r\ni think `@theme/index` should not config default layout and enhanceApp at same time or in the same file. or at least it must follow `Convention over configuration` rule.\r\n\r\nif follow [vuepress default theme file system](https://github.com/vuejs/vuepress/tree/master/packages/%40vuepress/theme-default) and `Convention over configuration`, it will be better\r\n\r\nmaybe use `@theme/layouts/`, `@theme/components/`\r\n\r\nand here is a bug, when a create emptyfile `theme` in `.vitepress` .it will crash",[],58,"want more flexibility in the customization part","2023-01-21T16:20:20Z","https://github.com/vuejs/vitepress/issues/58",0.70235604,{"description":2916,"labels":2917,"number":2918,"owner":2871,"repository":2872,"state":2891,"title":2919,"updated_at":2920,"url":2921,"score":2922},"I'm new to vue and vitepress so I'm a little confused.\r\n\r\nI'm looking into adding markdown to my existing vue app. The way I imagined it would be some markdown element which would take the markdown text and render it. I'm also interested in embedding vue components inside the markdown. Something like\r\n```\r\n\u003CMarkdown>\r\n## abc\r\nefg\r\n### hij\r\nHi {{name}},\r\n\u003C/Markdown>\r\n```\r\nI was hoping vitepress would do it, but it seems like vitepress sets everything up as a standalone app. I can't simply add vitepress to my package.json and start using it's elements.\r\n\r\nAny examples of using vitepress in an existing vue as a library? Or any alternative?",[],315,"Use vitepress in an existing vue app","2023-01-21T16:22:21Z","https://github.com/vuejs/vitepress/issues/315",0.7076864,{"description":2924,"labels":2925,"number":2926,"owner":2871,"repository":2872,"state":2891,"title":2927,"updated_at":2928,"url":2929,"score":2930},"**Is your feature request related to a problem? Please describe.**\r\nCurrently there seems to be no way to extend the Vite config used by vitepress (or at least it's not clear how to do it).\r\nIt would be great to have that ability to specify aliases that are used inside of components that are not part of VitePress.\r\n\r\nIn our case we have a component library in `src`, and the docs in `docs`, but components imported in VitePress use `#components/button` imports (for example) and VitePress can't resolve those as there's no way to set up aliases for it.\r\n\r\n**Describe the solution you'd like**\r\nA way to extend vite config and/or specify aliases.\r\n\r\n**Describe alternatives you've considered**\r\nI tried creating a vite config in the root, but that prevents TS based SFC's from compiling properly (I think it overwrites the internal config).\r\n\r\n**Additional context**\r\nA quick screenshot of our setup:\r\n\r\n\r\n`docs/.vitepress` hosts VitePress, but the root is Vite itself (library mode).",[],241,"Ability to extend vite config","2023-01-21T14:20:28Z","https://github.com/vuejs/vitepress/issues/241",0.7167075,{"description":2932,"labels":2933,"number":1224,"owner":2871,"repository":2872,"state":2891,"title":2937,"updated_at":2938,"url":2939,"score":2940},"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? ",[2934],{"name":2935,"color":2936},"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.7182894,{"description":2942,"labels":2943,"number":2945,"owner":2871,"repository":2872,"state":2891,"title":2946,"updated_at":2947,"url":2948,"score":2949},"### Describe the bug\n\nWe use VitePress to build a demo website for a component library. To allow the Vue browser tools to work on this demo website, we would like to build and publish the website in production mode.\r\n\r\nI thought that adding `mode: 'development'` to our `vite.config.ts` would accomplish this, but it throws errors like this when building:\r\n```\r\n⠦ rendering pages...Error: Cannot find module '/introduction/usage.md?t=1649205963799'\r\nRequire stack:\r\n- /home/catrope/git/codex/packages/codex-docs/docs/.vitepress/.temp/app.js\r\n- /home/catrope/git/codex/packages/codex-docs/node_modules/vitepress/dist/node/serve-9874c5ac.js\r\n- /home/catrope/git/codex/packages/codex-docs/node_modules/vitepress/dist/node/cli.js\r\n- /home/catrope/git/codex/packages/codex-docs/node_modules/vitepress/bin/vitepress.js\r\n at Function.Module._resolveFilename (node:internal/modules/cjs/loader:933:15)\r\n at Function.Module._load (node:internal/modules/cjs/loader:778:27)\r\n at Module.require (node:internal/modules/cjs/loader:1005:19)\r\n at require (node:internal/modules/cjs/helpers:94:18)\r\n at /home/catrope/git/codex/packages/codex-docs/docs/.vitepress/.temp/app.js:2098:12\r\n at loadPage (/home/catrope/git/codex/packages/codex-docs/docs/.vitepress/.temp/app.js:185:18)\r\n at Object.go (/home/catrope/git/codex/packages/codex-docs/docs/.vitepress/.temp/app.js:178:12)\r\n at renderPage (/home/catrope/git/codex/packages/codex-docs/node_modules/vitepress/dist/node/serve-9874c5ac.js:40217:10)\r\n at Object.build (/home/catrope/git/codex/packages/codex-docs/node_modules/vitepress/dist/node/serve-9874c5ac.js:40362:15) {\r\n code: 'MODULE_NOT_FOUND',\r\n requireStack: [\r\n '/home/catrope/git/codex/packages/codex-docs/docs/.vitepress/.temp/app.js',\r\n '/home/catrope/git/codex/packages/codex-docs/node_modules/vitepress/dist/node/serve-9874c5ac.js',\r\n '/home/catrope/git/codex/packages/codex-docs/node_modules/vitepress/dist/node/cli.js',\r\n '/home/catrope/git/codex/packages/codex-docs/node_modules/vitepress/bin/vitepress.js'\r\n ]\r\n}\r\n```\r\nThis error repeats for every Markdown file. The build then says it has succeeded, and it does produce a directory structure with HTML files, but all of them contain a 404 error page.\r\n\r\nI also tried adding `vue: { isProduction: false }` to the VitePress config, but that doesn't appear to make the development tools work.\n\n### Reproduction\n\n- In `docs/vite.config.ts`,add `mode: 'development'` at the top level (our full Vite config is [here](https://github.com/wikimedia/design-codex/blob/main/packages/codex-docs/docs/vite.config.ts))\r\n- Run `vitepress build docs`\r\n- Lots of errors are thrown, and a build is generated that contains only 404 pages\n\n### Expected behavior\n\nA static site is built that has the correct content in it (not just 404 pages), and that uses the development build of Vue rather than the production build. At minimum, enabling development mode shouldn't blow everything up.\n\n### System Info\n\n```shell\nSystem:\r\n OS: Linux 5.4 Ubuntu 20.04.4 LTS (Focal Fossa)\r\n CPU: (8) x64 Intel(R) Core(TM) i7-8650U CPU @ 1.90GHz\r\n Memory: 1.89 GB / 15.39 GB\r\n Container: Yes\r\n Shell: 5.0.17 - /bin/bash\r\n Binaries:\r\n Node: 16.9.1 - ~/.nvm/versions/node/v16.9.1/bin/node\r\n Yarn: 1.22.11 - ~/.nvm/versions/node/v16.9.1/bin/yarn\r\n npm: 8.5.3 - ~/.nvm/versions/node/v16.9.1/bin/npm\r\n Browsers:\r\n Chrome: 100.0.4896.75\r\n Chromium: 100.0.4896.60\r\n Firefox: 98.0.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/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.",[2944],{"name":2900,"color":2901},598,"Building with `mode: 'development'` throws errors, generates all pages as 404s","2023-01-21T16:04:31Z","https://github.com/vuejs/vitepress/issues/598",0.72712576,{"description":2951,"labels":2952,"number":2956,"owner":2871,"repository":2872,"state":2891,"title":2957,"updated_at":2958,"url":2959,"score":2960},"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",[2953],{"name":2954,"color":2955},"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.72897315,["Reactive",2962],{},["Set"],["ShallowReactive",2965],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fBYYnfK3MCrHq_GfLHCDz8rxPHAZDPVAldvhWI1jRWV4":-1},"/vuejs/vitepress/4717"]