\r\n title: Feature A\r\n details: Lorem ipsum dolor sit amet, consectetur adipiscing elit\r\n```\r\n\r\nCheck the feature icon type\r\n```ts\r\ntype FeatureIcon =\r\n | string\r\n | { src: string; alt?: string; width?: string; height: string }\r\n | {\r\n light: string\r\n dark: string\r\n alt?: string\r\n width?: string\r\n height: string\r\n }\r\n```\r\n\r\nI refer to the render logic, use `v-html` render the icon.\r\nDisplay well in `dev` environment, but shows errors in `prod` environment.\r\n\r\n| dev | build |\r\n| ----------- | ----------- |\r\n|  |  |\r\n\r\n\r\n\r\n\r\n\r\n### Reproduction\r\n\r\nhttps://stackblitz.com/github/zyyv/vitepress-unocss-issue\r\n\r\n- Display right run `pnpm dev`\r\n- Display error run `pnpm build && pnpm preview`\r\n\r\n### Expected behavior\r\n\r\nDev and build behave the same\r\n\r\n### System Info\r\n\r\n```Text\r\nlatest\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] Check if you're on the [latest VitePress version](https://github.com/vuejs/vitepress/releases/latest).\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.",[2903,2906,2909],{"name":2904,"color":2905},"build","377ba8",{"name":2907,"color":2908},"has-workaround","1B4515",{"name":2866,"color":2867},4045,"SSR in dev for more consistent output in dev and prod","2025-03-02T18:08:58Z","https://github.com/vuejs/vitepress/issues/4045",0.7431343,{"description":2916,"labels":2917,"number":1858,"owner":2869,"repository":2870,"state":2919,"title":2920,"updated_at":2921,"url":2922,"score":2923},"**Describe the bug**\r\n\r\nHello, Evan! I'm very excited about this project, was playing around with it, trying to see if our existing vuepress content will work here. Discovered, that having this in `index.md` breaks static build:\r\n```md\r\n# Vitepress build bug\r\n\r\n test: [VuePress](https://vuepress.vuejs.org/)\r\n\r\n## Second header\r\n```\r\n\r\n`vitepress build` result does not display rendered page and shows hydration error in console:\r\n\r\n\r\n\r\nRemoving the link or the second header makes build working again\r\n\r\nAlso displays warnings while building:\r\n\r\n**To Reproduce**\r\nSteps to reproduce the behavior:\r\n1. Build https://github.com/larionov/vitepress-build-bug\r\n```sh\r\ngit clone git@github.com:larionov/vitepress-build-bug.git\r\ncd vitepress-build-bug/\r\nnpm install\r\nnpm run build\r\nnpx serve .vitepress/dist\r\n```\r\n2. Open http://localhost:5000/ in browser.\r\n\r\n**Expected behavior**\r\nI expect to see the contents of index.md on the main page, and no errors in console\r\n\r\n**System Info**\r\n- vitepress version :v0.3.1\r\n- vite version: v0.20.7\r\n- Node version: v12.16.1\r\n- OS version: Linux 5.6.15-arch1-1\r\n",[2918],{"name":2880,"color":2881},"closed","Having a link and second header in index.md breaks `vitepress build`","2023-01-21T16:25:41Z","https://github.com/vuejs/vitepress/issues/24",0.71793795,{"description":2925,"labels":2926,"number":2927,"owner":2869,"repository":2870,"state":2919,"title":2928,"updated_at":2929,"url":2930,"score":2931},"### Describe the bug\n\nHello, thank you so much for vitepress — we are using it for https://observablehq.com/plot/\r\n\r\nCurrently we see that the instant search **detailed list** feature works in `docs:dev` but does not work with `docs:preview` (nor in production). \r\n\r\nWe are currently using v1.0.0-alpha.72, but I tried locally upgrading to v1.0.0-beta.1 and the issue is still here.\r\n\n\n### Reproduction\n\nClone https://github.com/observablehq/plot\r\nchange vitepress version to v1.0.0-beta.1 in package.json\r\nrun yarn; yarn docs:build; yarn docs:preview\r\nopen the site and search “color”\r\n\r\nscreenshot: left: docs:dev; right: docs:preview\r\n\r\n\r\n\n\n### Expected behavior\n\nThe detailed list should appear.\n\n### System Info\n\n```sh\nSystem:\r\n OS: macOS 13.3.1\r\n CPU: (8) arm64 Apple M1\r\n Memory: 63.64 MB / 16.00 GB\r\n Shell: 5.9 - /bin/zsh\r\n Binaries:\r\n Node: 20.1.0 - ~/.nvm/versions/node/v20.1.0/bin/node\r\n Yarn: 1.22.19 - /opt/homebrew/bin/yarn\r\n npm: 9.6.4 - ~/.nvm/versions/node/v20.1.0/bin/npm\r\n Browsers:\r\n Chrome: 114.0.5735.106\r\n Firefox: 113.0.2\r\n Safari Technology Preview: 16.4\r\n npmPackages:\r\n vitepress: ^1.0.0-beta.1 => 1.0.0-beta.1\n```\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.",[],2485,"Detailed list doesn't work with docs:preview (only works with docs:dev)","2023-06-15T00:04:10Z","https://github.com/vuejs/vitepress/issues/2485",0.7282104,{"description":2933,"labels":2934,"number":2936,"owner":2869,"repository":2870,"state":2919,"title":2937,"updated_at":2938,"url":2939,"score":2940},"### Describe the bug\n\nI use the global variable window in component, It will cause the content below it to be rendered repeatedly.\r\n**Also, it only happens after the build.**\n\n### Reproduction\n\n```\r\n// Component.vue\r\n\r\n\u003Cscript setup>\r\n const url = `${window.location.protocol}//www.xxx.com`;\r\n\u003C/script>\r\n\r\n\u003Ctemplate>\r\n \u003Ch1>{{ url }}\u003C/h1>\r\n\u003C/template>\r\n```\r\n\r\n\r\n```\r\n// index.md\r\n\r\n\u003CComponent />\r\n\r\n// Here! `- test content ...` repeat render! it shows two.\r\n- test content ...\r\n```\n\n### Expected behavior\n\nSuccessfully rendered only once.\n\n### System Info\n\n```shell\nSystem:\r\n OS: macOS 12.5\r\n CPU: (8) x64 Apple M1\r\n Memory: 43.79 MB / 8.00 GB\r\n Shell: 5.8.1 - /bin/zsh\r\n Binaries:\r\n Node: 14.19.3 - ~/.nvm/versions/node/v14.19.3/bin/node\r\n Yarn: 1.22.19 - /opt/homebrew/bin/yarn\r\n npm: 6.14.17 - ~/.nvm/versions/node/v14.19.3/bin/npm\r\n Browsers:\r\n Chrome: 104.0.5112.101\r\n Safari: 15.6\r\n npmPackages:\r\n vitepress: ^1.0.0-alpha.13 => 1.0.0-alpha.13\n```\n\n\n### Additional context\n\n\u003Cimg width=\"1109\" alt=\"image\" src=\"https://user-images.githubusercontent.com/50652358/187465157-4ea24772-f3ef-4ec3-8717-298579837525.png\">\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.vuejs.org).\n- [X] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.",[2935],{"name":2880,"color":2881},1261,"Unexpected render after the build.","2023-01-21T14:26:49Z","https://github.com/vuejs/vitepress/issues/1261",0.72838604,{"description":2942,"labels":2943,"number":2947,"owner":2869,"repository":2870,"state":2919,"title":2948,"updated_at":2949,"url":2950,"score":2951},"### Describe the bug\n\nWhen I customize a link component and introduce it into vitepress, the `vp-doc` class generates a style override on my custom style, causing my style to not display properly:\r\n\r\nI've tried `vp-raw` for style isolation, but it still doesn't display my custom styles properly\r\n\r\nI don't know how to solve this style override problem, which has been bothering me for a long time\n\n### Reproduction\n\nThis is my custom link component:\r\n```tsx\r\nimport { defineComponent, PropType, ref } from \"vue\";\r\nimport \"uno.css\";\r\n\r\nexport type IType = 'default' | 'primary' | 'success' | 'warning' | 'danger'| 'info'\r\nexport type IColor = 'black' | 'blue' | 'green' | 'yellow'| 'red' | 'gray'\r\nexport const props = {\r\n type: {\r\n type: String as PropType\u003CIType>,\r\n default: \"default\",\r\n },\r\n color: {\r\n type: String as PropType\u003CIColor>,\r\n default: \"black\",\r\n },\r\n plain: {\r\n type: Boolean,\r\n default: true,\r\n },\r\n href: {\r\n type: String,\r\n required: true,\r\n },\r\n} as const;\r\n\r\nexport default defineComponent({\r\n name: \"CLink\",\r\n props,\r\n setup(props, { slots }) {\r\n return () => (\r\n \u003Ca\r\n class={`\r\n text-${props.plain ? props.color + \"-500\" : \"white\"}\r\n hover:text-${props.color}-400\r\n cursor-pointer\r\n text-lg\r\n hover:text-white\r\n transition duration-300 ease-in-out transform hover:scale-105\r\n mx-1\r\n decoration-none\r\n `}\r\n href={props.href} \r\n >\r\n {slots.default ? slots.default() : 'Link'}\r\n \u003C/a>\r\n ); \r\n },\r\n});\r\n```\r\n\r\nHere's my demo code from the documentation:\r\n```vue\r\n\u003Cdiv class=\"vp-raw\">\r\n \u003CCLink href=\"#\" class=\"primary\" color=\"blue\">Primary Link\u003C/CLink>\r\n \u003CCLink href=\"#\" type=\"success\" color=\"green\">Success Link\u003C/CLink>\r\n \u003CCLink href=\"#\" type=\"warning\" color=\"yellow\">Warning Link\u003C/CLink>\r\n \u003CCLink href=\"#\" type=\"danger\" color=\"red\">Danger Link\u003C/CLink>\r\n \u003CCLink href=\"#\" type=\"info\" color=\"gray\">Info Link\u003C/CLink>\r\n\u003C/div>\r\n```\r\n\r\n\r\n\n\n### Expected behavior\n\nI want to be able to display the style of my components properly, in fact I can be sure that the `vp-doc` generated style override, I delete this class by manipulating the DOM and then the style can be displayed normally, but this will make the other functions of vitepress failure, I want to be able to display the style of the component without affecting vitepress\n\n### System Info\n\n```shell\n{\r\n \"name\": \"catisol-ui\",\r\n \"version\": \"0.9.1\",\r\n \"description\": \"\",\r\n \"main\": \"index.js\",\r\n \"scripts\": {\r\n \"test\": \"vitest\",\r\n \"build\": \"vite build\",\r\n \"dev\": \"vite\",\r\n \"docs:dev\": \"vitepress dev docs\",\r\n \"docs:build\": \"vitepress build docs\",\r\n \"docs:serve\": \"vitepress serve docs\"\r\n },\r\n \"keywords\": [],\r\n \"author\": \"\",\r\n \"license\": \"ISC\",\r\n \"devDependencies\": {\r\n \"@iconify-json/ic\": \"1.1.4\",\r\n \"@vitejs/plugin-vue\": \"3.0.3\",\r\n \"@vitejs/plugin-vue-jsx\": \"2.0.0\",\r\n \"@vue/test-utils\": \"2.0.2\",\r\n \"happy-dom\": \"6.0.4\",\r\n \"postcss\": \"^8.4.21\",\r\n \"postcss-prefix-selector\": \"^1.16.0\",\r\n \"unocss\": \"0.45.6\",\r\n \"vite\": \"3.0.7\",\r\n \"vitepress\": \"v1.0.0-alpha.31\",\r\n \"vitest\": \"0.21.1\"\r\n },\r\n \"maintainers\": [\r\n \"isolcat\"\r\n ],\r\n \"dependencies\": {\r\n \"@unocss/vite\": \"^0.45.13\",\r\n \"vue\": \"3.2.37\"\r\n }\r\n}\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":2945,"color":2946},"need more info","bdbefc",1777,"vp-raw cannot isolate style conflicts generated by v-doc classes","2023-01-21T14:16:44Z","https://github.com/vuejs/vitepress/issues/1777",0.7309401,{"description":2953,"labels":2954,"number":2956,"owner":2869,"repository":2870,"state":2919,"title":2957,"updated_at":2958,"url":2959,"score":2960},"### Describe the bug\n\nI have a custom Layout.vue to customize the hero page, I want my video tag load different mp4 file based on current theme:\r\n\r\n```vue\r\n\u003Cscript setup>\r\nimport DefaultTheme from \"vitepress/theme\";\r\nimport { withBase, useData } from 'vitepress'\r\nconst { isDark } = useData();\r\nconsole.log(`isDark ${isDark.value}`);\r\n\u003C/script>\r\n\r\n\u003Ctemplate>\r\n \u003CDefaultTheme.Layout>\r\n \u003Ctemplate #home-hero-image>\r\n \u003Cvideo autoplay loop muted :src=\"withBase(`/video/${isDark ? 'dark' : 'light'}/x.mp4`)\" class=\"video\" />\r\n \u003C/template>\r\n \u003C/DefaultTheme.Layout>\r\n\u003C/template>\r\n```\r\n\r\nthis works perfect during development, but once I build vitepress and serve, my video is always in light mode, even though isDark is true.\r\n\r\nI found out that during `npm run build`, my Layout template is pre-compiled, so at this point, isDark is always false\r\n\r\nHow can I fix this?\n\n### Reproduction\n\nas above\n\n### Expected behavior\n\nconsist behavior\n\n### System Info\n\n```Text\nSystem:\r\n OS: macOS 13.5.2\r\n CPU: (8) x64 Intel(R) Core(TM) i7-7920HQ CPU @ 3.10GHz\r\n Memory: 191.28 MB / 16.00 GB\r\n Shell: 3.2.57 - /bin/bash\r\n Binaries:\r\n Node: 21.2.0 - /usr/local/bin/node\r\n Yarn: 1.22.10 - /usr/local/bin/yarn\r\n npm: 10.2.3 - /usr/local/bin/npm\r\n Browsers:\r\n Chrome: 119.0.6045.159\r\n Edge: 119.0.2151.72\r\n Safari: 16.6\r\n npmPackages:\r\n vitepress: ^1.0.0-rc.31 => 1.0.0-rc.31\n```\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.",[2955],{"name":2880,"color":2881},3267,"Inconsist behavior between development & production","2023-12-22T00:04:33Z","https://github.com/vuejs/vitepress/issues/3267",0.732095,{"description":2962,"labels":2963,"number":2965,"owner":2869,"repository":2870,"state":2919,"title":2966,"updated_at":2967,"url":2968,"score":2969},"### Describe the bug\r\n\r\nwhen I update the version to `\"vitepress\": \"^1.0.0-alpha.63\",` , and run `vitepress dev docs`, The Aside component is render nothing\r\n\r\n\r\n\r\n### Reproduction\r\n\r\nupdate the vitepress version to `\"vitepress\": \"^1.0.0-alpha.63\",`\r\n\r\nrun `vitepress dev docs`\r\n\r\n`config.js`\r\n```\r\nimport { defineConfigWithTheme } from 'vitepress';\r\nimport vueJsx from '@vitejs/plugin-vue-jsx';\r\nimport baseConfig from '@vue/theme/config';\r\nimport { demoBlockPlugin } from 'vitepress-theme-demoblock';\r\nimport path from 'path';\r\n\r\nimport { i18n, nav, sidebar } from './themeConfig/index';\r\n\r\nexport default defineConfigWithTheme({\r\n extends: baseConfig,\r\n lang: 'zh-CN',\r\n title: 'SinoGear Vue',\r\n description: '',\r\n srcDir: './src',\r\n scrollOffset: 'header',\r\n ignoreDeadLinks: true,\r\n head: [['meta', { name: 'theme-color', content: '#3c8772' }]],\r\n themeConfig: {\r\n nav,\r\n sidebar,\r\n appearance: false, // 开启 light/dark 模式\r\n // Placeholder of the i18n config for @vuejs-translations.\r\n i18n,\r\n },\r\n\r\n markdown: {\r\n config(md) {\r\n md.use(demoBlockPlugin, {\r\n cssPreprocessor: 'less',\r\n scriptImports: [\r\n \"import * as AntDesignVue from 'ant-design-vue'\",\r\n ],\r\n scriptReplaces: [\r\n {\r\n searchValue: /import ({.*}) from 'ant-design-vue'/g,\r\n replaceValue: (s, s1) => `const ${s1} = AntDesignVue`\r\n },\r\n ]\r\n });\r\n }\r\n },\r\n\r\n vite: {\r\n server: {\r\n host: true,\r\n port: 3001,\r\n fs: {\r\n // for when developing with locally linked theme\r\n allow: ['../..']\r\n }\r\n },\r\n build: {\r\n chunkSizeWarningLimit: Infinity\r\n },\r\n json: {\r\n stringify: true\r\n },\r\n ssr: {\r\n noExternal: ['@wangeditor/editor', '@wangeditor/editor-for-vue', 'ant-design-vue', '@ant-design/icons-vue', '@babel/runtime']\r\n },\r\n plugins: [vueJsx()],\r\n css: {\r\n preprocessorOptions: {\r\n less: {\r\n javascriptEnabled: true\r\n }\r\n }\r\n }\r\n },\r\n\r\n vue: {\r\n reactivityTransform: path.resolve(__dirname, 'src')\r\n }\r\n});\r\n\r\n```\r\n\r\n### Expected behavior\r\n\r\nrender aside component\r\n\r\n### System Info\r\n\r\n\r\n`packages.json`\r\n```shell\r\n\r\n\"@babel/plugin-syntax-jsx\": \"^7.18.6\",\r\n \"@vitejs/plugin-vue\": \"^4.0.0\",\r\n \"@vitejs/plugin-vue-jsx\": \"^3.0.0\",\r\n \"@vue/babel-plugin-jsx\": \"^1.1.1\",\r\n \"@vue/compiler-sfc\": \"^3.0.4\",\r\n \"conventional-changelog-cli\": \"^2.1.0\",\r\n \"cross-env\": \"^7.0.2\",\r\n \"del\": \"^6.0.0\",\r\n \"gulp\": \"^4.0.2\",\r\n \"gulp-babel\": \"^8.0.0\",\r\n \"highlight.js\": \"^10.4.1\",\r\n \"less\": \"^4.1.2\",\r\n \"lint-staged\": \"^13.0.3\",\r\n \"prettier\": \"^2.7.1\",\r\n \"rimraf\": \"^3.0.0\",\r\n \"transliteration\": \"^2.2.0\",\r\n \"vitepress\": \"^1.0.0-alpha.63\",\r\n \"vitepress-plugin-search\": \"^1.0.4-alpha.17\",\r\n \"vitepress-theme-demoblock\": \"^2.0.0\"\r\n```\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.dev).\r\n- [X] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.",[2964],{"name":2945,"color":2946},2157,"The Aside component is render nothing","2023-04-05T00:04:02Z","https://github.com/vuejs/vitepress/issues/2157",0.73312277,["Reactive",2971],{},["Set"],["ShallowReactive",2974],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fWIaO37QnaV2zAgxM1VpGsenxOjZgxwhCDCF_dvhDKzA":-1},"/vuejs/vitepress/2995"]