`, and also call a specific function that is dependent upon that script being loaded, i.e:\r\n\r\n```html\r\n\u003Cscript src=\"/load/external/file\" />\r\n\u003Cscript>\r\n// run code dependent upon external file\r\n\u003C/script>\r\n```\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.",[],3982,"Unable to run code `onload`","2024-07-02T04:42:00Z","https://github.com/vuejs/vitepress/issues/3982",0.7507518,{"description":3061,"labels":3062,"number":3066,"owner":3022,"repository":3023,"state":3024,"title":3067,"updated_at":3068,"url":3069,"score":3070},"### Discussed in https://github.com/vuejs/vitepress/discussions/527\r\n\r\n\u003Cdiv type='discussions-op-text'>\r\n\r\n\u003Csup>Originally posted by **WebMechanic** February 11, 2022\u003C/sup>\r\nHello,\r\n\r\nI have a fresh install of VitePress to document our new Style Guide and wanted to use the [Import Code Snippets](https://vitepress.vuejs.org/guide/markdown.html#import-code-snippets) feature for .js, .css and .html fragments, but the file(s) are not included. I tried all sorts of pathnames with/without the `base`, relative, absolute, all to no avail.\r\nEverything else works like a charme.\r\n\r\nThe project is a simple Vite Vue project. I then installed VitePress with yarn. \r\nIt resides in `src/_docs/.vitepress`.\r\n\r\nHere's the config file\r\n```js\r\nimport {defineConfig} from 'vitepress'\r\nexport default defineConfig({\r\n base: '/src/_docs/',\r\n title: \"The Style Guide\",\r\n markdown: {\r\n lineNumbers: false,\r\n toc: {includeLevel: [1, 2]},\r\n }\r\n}\r\n```\r\n\u003C/div>\r\n\r\nIt's not clear to me, if this requires some special care for Prism. Configuration seems very different fro what I can find on Lea Verou's site.\r\n",[3063],{"name":3064,"color":3065},"invalid","ffffff",530,"\"Import Code Snippets\" not working","2023-01-21T16:04:03Z","https://github.com/vuejs/vitepress/issues/530",0.75749665,{"description":3072,"labels":3073,"number":3075,"owner":3022,"repository":3023,"state":3024,"title":3076,"updated_at":3077,"url":3078,"score":3079},"### Discussed in https://github.com/vuejs/vitepress/discussions/1041\r\n\r\n\u003Cdiv type='discussions-op-text'>\r\n\r\n\u003Csup>Originally posted by **akil-rails** July 22, 2022\u003C/sup>\r\nThe [guide](https://vitepress.vuejs.org/guide/using-vue.html) explains:\r\n\r\n> To use code that assumes a browser environment on import, you need to dynamically import them in proper lifecycle hooks: how to use components th\r\n\r\n```vue\r\n\u003Cscript>\r\nexport default {\r\n mounted() {\r\n import('./lib-that-access-window-on-import').then((module) => {\r\n // use code\r\n })\r\n }\r\n}\r\n\u003C/script>\r\n```\r\n\r\nWhen the library is directly referenced (instead of a dependency), the load fails. Is this the expected behaviour? If so, the docs could mention that.\r\n\r\n`mermaid:1 Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of \"text/html\". Strict MIME type checking is enforced for module scripts per HTML spec.`\r\n\r\n```vue\r\n\u003Cscript>\r\nexport default {\r\n mounted() {\r\n import('https://cdn.skypack.dev/mermaid').then((module) => {\r\n // use code\r\n })\r\n }\r\n}\r\n\u003C/script>\r\n```\r\n\u003C/div>\r\n\r\n\r\n### Steps to reproduce\r\n```\r\ngit clone git@github.com:akil-rails/vitepress-starter.git\r\ncd vitepress-starter\r\npnpm i\r\npnpm run docs:build\r\npnpm run docs:serve\r\n```\r\n1. Open the URL in chrome\r\n2. In chrome developer tools/console, you'll see the message \r\n```\r\nFailed to load module script: Expected a JavaScript module script but the server responded with a MIME type of \"text/html\". Strict MIME type checking is enforced for module scripts per HTML spec.\r\n```",[3074],{"name":3019,"color":3020},1042,"Dynamic Component with External Script - 'Failed to load module script:'","2023-01-21T14:30:10Z","https://github.com/vuejs/vitepress/issues/1042",0.7576474,{"description":3081,"labels":3082,"number":3084,"owner":3022,"repository":3023,"state":3024,"title":3085,"updated_at":3086,"url":3087,"score":3088},"**Is your feature request related to a problem? Please describe.**\r\n\r\nI'm playing with the vuejs blog template, and I'm frustrated that the customData global properties is not updated on adding a new markdown file.\r\nCreating a new post required a vitepress restart. Vitepress know that a new file exist (we can load it in a new tab), but the global computed content is not updated.\r\n\r\n**Describe the solution you'd like**\r\n\r\nAdding / removing a file on the site folder (ie not the .vitepress folder) trigger an update of the global computed $site.customData (so an update of all pages using this global property).\r\n\r\n**Additional context**\r\n\r\nA basic demo project consists of the vitepress \"getting started\" project with the following modifications : \r\n\r\n- hello.md : \r\n```markdown\r\n# Hello VitePress\r\n\r\nhello\r\n\r\n{{ $site }}\r\n```\r\n\r\n- .vitepress/config.js : \r\n\r\n``` javascript\r\nconst { getPosts } = require(\"./getPosts\");\r\n\r\nmodule.exports = {\r\n title: \"Hello VitePress\",\r\n description: \"Just playing around.\",\r\n customData: {\r\n posts: getPosts(),\r\n },\r\n};\r\n```\r\n\r\n- .vitepress/getPosts.js : \r\n``` javascript\r\nconst fs = require(\"fs\");\r\nconst path = require(\"path\");\r\n\r\nexports.getPosts = function getPosts() {\r\n console.log(\"calling get posts\");\r\n const postDir = path.resolve(__dirname, \"../posts\");\r\n return fs.readdirSync(postDir);\r\n};\r\n```\r\n\r\n- a new posts folder in the vitepress project, where we are adding new markdown files.\r\n\r\n\r\n",[3083],{"name":3064,"color":3065},208,"Refresh global computed $site.customData when a new file is detected in the project.","2023-01-21T16:22:28Z","https://github.com/vuejs/vitepress/issues/208",0.75832194,{"description":3090,"labels":3091,"number":3095,"owner":3022,"repository":3023,"state":3024,"title":3096,"updated_at":3097,"url":3098,"score":3099},"### Describe the bug\n\nI want to extend Default theme by custom .scss and .vue files,but when I run 'yarn docs:dev', it output a error \"No loader is configured for \".scss\"\n\n### Reproduction\n\n1. new file index.scss \r\n2. import index.scss\r\n3. yarn docs:dev\r\n\n\n### Expected behavior\n\nnormal operation by import .scss and .vue files\r\n\n\n### System Info\n\n```Text\nmac chrome\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.",[3092],{"name":3093,"color":3094},"bug: pending triage","e99695",3050,"No loader is configured for \".scss\" \".vue\"","2023-10-15T00:04:49Z","https://github.com/vuejs/vitepress/issues/3050",0.7591847,{"description":3101,"labels":3102,"number":3104,"owner":3022,"repository":3023,"state":3024,"title":3105,"updated_at":3106,"url":3107,"score":3108},"### 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.",[3103],{"name":3093,"color":3094},3267,"Inconsist behavior between development & production","2023-12-22T00:04:33Z","https://github.com/vuejs/vitepress/issues/3267",0.76079893,{"description":3110,"labels":3111,"number":3113,"owner":3022,"repository":3023,"state":3024,"title":3114,"updated_at":3115,"url":3116,"score":3117},"### Describe the bug\r\n\r\nTrying to use `const articles = import.meta.glob('../*.js')` within config.js will give you an error.\r\n\r\n```\r\nfailed to load config from /**/docs/.vitepress/config.js\r\n```\r\n\r\n### Reproduction\r\n\r\nadd `const articles = import.meta.glob('../*.js')` to config.js\r\n\r\n### Expected behavior\r\n\r\nIt would be nice to be able to build a dynamic sidebar based on files you load from a directory.\r\n\r\n### System Info\r\n\r\n```shell\r\nosx, new build of vitepress as of today\r\n```\r\n\r\n\r\n### Additional context\r\n\r\nSince, `require(\"fs\");` and `require(\"path\")` dont work with vite, how else might I analyze the file system to build my sidebar?\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.",[3112],{"name":3019,"color":3020},572,"Make import.meta work in .vitepress/config.js","2023-01-21T14:32:52Z","https://github.com/vuejs/vitepress/issues/572",0.76194966,["Reactive",3119],{},["Set"],["ShallowReactive",3122],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fMXcdZJVFW6s5EZJhP7XvbIkorfo2tYQJ_-Ghw996mTw":-1},"/vuejs/vitepress/4800"]