This approach requires you to determine which parts of your theme could be extended. It is more suitable for those common customizations like page footer or header.
You just need to provide slots in your layouts, and tell users how to make use of them:
This approach requires you to consider which components of your theme should be replaceable, and you also need to split components into a suitable granularity.
First, set alias for replaceable components of you theme:
import type { Theme } from 'vuepress/core'
+import { getDirname } from 'vuepress/utils'
+
+const __dirname = getDirname(import.meta.url)
+
+export const fooTheme = (options): Theme => ({
+ name: 'vuepress-theme-foo',
+ alias: {
+ // set alias for replaceable components
+ '@theme/Navbar.vue': path.resolve(__dirname, 'components/Navbar.vue'),
+ '@theme/Sidebar.vue': path.resolve(__dirname, 'components/Sidebar.vue'),
+ },
+})
Next, use those components via aliases in your theme:
Each Markdown file is first compiled into HTML, and then converted to a Vue SFC. In other words, you can write a Markdown file like a Vue SFC:
Blocks <script> and <style> are treated as Vue SFC blocks as they are. In other words, they are hoisted from the <template> block to the top-level of SFC.
Everything outside <script> and <style> will be compiled into HTML, and be treated as Vue SFC <template> block.
Warning
As Vue SFC can contain only one <script> element, you should avoid using more than one <script> in VuePress markdown.
As we know, VuePress plugin entries and theme entries are processed in Node side, but sometimes you might need to pass data to client side. For example, you want to generate different data when users use different options.
You can make use of useRoutes to get all routes information.
The return value of useRoutes is a Ref object containing all routes. The keys are route paths of each route, and the values are the corresponding route information.
There is a notFound field in the returned information, which is used to indicate whether a corresponding route exists for a given path. When the route does not exist, the notFound field would be true, the path field would be the normalized path, and the meta and loader fields would point to the default 404 page.
VuePress will generate a SSR application to pre-render pages during build. Generally speaking, if a code snippet is using Browser / DOM APIs before client app is mounted, we call it non-SSR-friendly.
We already provides a ClientOnly component to wrap non-SSR-friendly content.
In the enhance function, you can make use of the __VUEPRESS_SSR__ flag for that purpose.
You can take the setup function as part of the setup hook of the root component. Thus, all composition APIs are available here.
import { provide, ref } from 'vue'
+import { useRoute, useRouter } from 'vue-router'
+import { defineClientConfig } from 'vuepress/client'
+
+export default defineClientConfig({
+ setup() {
+ // get the current route location
+ const route = useRoute()
+ // get the vue-router instance
+ const router = useRouter()
+ // provide a value that can be injected by layouts, pages and other components
+ const count = ref(0)
+ provide('count', count)
+ },
+})
A plugin usually needs to allow user options, so we typically provide users with a function to receive options, and returns a Plugin Object or a Plugin Function. Then your plugin should be converted like this:
Set name to follow the naming convention, i.e. vuepress-plugin-xxx or @org/vuepress-plugin-xxx, which should be consistent with the name field of the Plugin Object.
Set keywords to include vuepress-plugin, so that users can search your plugin on NPM.
A VuePress theme is a special plugin, which should satisfy the Theme API. Like plugins, a theme should also be a Theme Object or a Theme Function, and could be wrapped with a function to receive options:
import { getDirname, path } from 'vuepress/utils'
+
+const __dirname = getDirname(import.meta.url)
+
+const fooTheme = (options) =>
+ // returns a theme object
+ ({
+ name: 'vuepress-theme-foo',
+
+ // path to the client config of your theme
+ clientConfigFile: path.resolve(__dirname, 'client.js'),
+
+ // set custom dev / build template
+ // if the template is not specified, the default template
+ templateBuild: path.resolve(__dirname, 'templates/build.html'),
+ templateDev: path.resolve(__dirname, 'templates/dev.html'),
+
+ // use plugins
+ plugins: [
+ // ...
+ ],
+
+ // other plugin APIs are also available
+ })
+
+const barTheme =
+ (options) =>
+ // returns a theme function
+ (app) => ({
+ name: 'vuepress-theme-bar',
+ // ...
+ })
import { defineClientConfig } from 'vuepress/client'
+import Layout from './layouts/Layout.vue'
+import NotFound from './layouts/NotFound.vue'
+
+export default defineClientConfig({
+ layouts: {
+ Layout,
+ NotFound,
+ },
+})
The layouts field declares the layouts provided by your theme. A theme must provide at least two layouts: Layout and NotFound. The former is to provide default layout for common pages, while the latter is to provide layout for 404-not-found page.
The Layout layout should contain the Content component to display the markdown content:
Set name to follow the naming convention: vuepress-theme-xxx or @org/vuepress-theme-xxx, which should be consistent with the name field of the Theme Object.
Set keywords to include vuepress-theme, so that users can search your theme on NPM.
+
+
+
diff --git a/assets/404.html-BJQsmBKA.js b/assets/404.html-BJQsmBKA.js
new file mode 100644
index 000000000..81527a8ff
--- /dev/null
+++ b/assets/404.html-BJQsmBKA.js
@@ -0,0 +1 @@
+import{_ as t,o as e,c as o,a as n}from"./app-CqHoxGIc.js";const r={},a=n("p",null,"404 Not Found",-1),s=[a];function c(p,l){return e(),o("div",null,s)}const d=t(r,[["render",c],["__file","404.html.vue"]]),m=JSON.parse('{"path":"/404.html","title":"","lang":"en-US","frontmatter":{"layout":"NotFound","description":"404 Not Found","head":[["meta",{"property":"og:url","content":"https://v2.vuepress.vuejs.org/404.html"}],["meta",{"property":"og:site_name","content":"VuePress"}],["meta",{"property":"og:description","content":"404 Not Found"}],["meta",{"property":"og:type","content":"website"}],["meta",{"property":"og:locale","content":"en-US"}],["script",{"type":"application/ld+json"},"{\\"@context\\":\\"https://schema.org\\",\\"@type\\":\\"WebPage\\",\\"name\\":\\"\\",\\"description\\":\\"404 Not Found\\"}"]]},"headers":[],"git":{},"autoDesc":true,"filePathRelative":null}');export{d as comp,m as data};
diff --git a/assets/NpmBadge-Bbgds1va.js b/assets/NpmBadge-Bbgds1va.js
new file mode 100644
index 000000000..c8033d35b
--- /dev/null
+++ b/assets/NpmBadge-Bbgds1va.js
@@ -0,0 +1 @@
+import{i as p,j as n,_ as d,o as g,c as _,a as i}from"./app-CqHoxGIc.js";const l=p({__name:"NpmBadge",props:{package:{},distTag:{default:"next"}},setup(s,{expose:c}){c();const e=s,a=n(()=>`https://www.npmjs.com/package/${e.package}`),t=n(()=>e.distTag?`${e.package}@${e.distTag}`:e.package),o=n(()=>`https://badgen.net/npm/v/${e.package}/${e.distTag}?label=${encodeURIComponent(t.value)}`),r={props:e,badgeLink:a,badgeLabel:t,badgeImg:o};return Object.defineProperty(r,"__isScriptSetup",{enumerable:!1,value:!0}),r}}),m=["href","title"],u=["src","alt"];function f(s,c,e,a,t,o){return g(),_("a",{class:"npm-badge",href:a.badgeLink,title:e.package,target:"_blank",rel:"noopener noreferrer"},[i("img",{src:a.badgeImg,alt:e.package},null,8,u)],8,m)}const k=d(l,[["render",f],["__scopeId","data-v-58259ba2"],["__file","NpmBadge.vue"]]);export{k as default};
diff --git a/assets/adding-extra-pages.html-Cyu55hRC.js b/assets/adding-extra-pages.html-Cyu55hRC.js
new file mode 100644
index 000000000..a3ec98f4d
--- /dev/null
+++ b/assets/adding-extra-pages.html-Cyu55hRC.js
@@ -0,0 +1,26 @@
+import{_ as p,r as o,o as t,c as r,a as n,b as s,d as e,w as l,e as c}from"./app-CqHoxGIc.js";const i={},d=n("h1",{id:"添加额外页面",tabindex:"-1"},[n("a",{class:"header-anchor",href:"#添加额外页面"},[n("span",null,"添加额外页面")])],-1),D=n("p",null,"有时你可能希望在不创建 Markdown 文件的情况下添加一些额外的页面。",-1),y=c(`
`,3);function m(v,C){const a=o("RouteLink");return t(),r("div",null,[d,D,n("p",null,[s("我们可以借助于 "),e(a,{to:"/zh/reference/plugin-api.html"},{default:l(()=>[s("插件 API")]),_:1}),s(" 和 "),e(a,{to:"/zh/reference/node-api.html"},{default:l(()=>[s("Node API")]),_:1}),s(" 来轻松实现。")]),y])}const h=p(i,[["render",m],["__file","adding-extra-pages.html.vue"]]),g=JSON.parse('{"path":"/zh/advanced/cookbook/adding-extra-pages.html","title":"添加额外页面","lang":"zh-CN","frontmatter":{"description":"添加额外页面 有时你可能希望在不创建 Markdown 文件的情况下添加一些额外的页面。 我们可以借助于 和 来轻松实现。 添加默认的主页 作为一个主题作者,你可能不想要求用户必须创建一个 /README.md 文件来作为主页,但是你希望提供一个默认的主页:","head":[["link",{"rel":"alternate","hreflang":"en-us","href":"https://v2.vuepress.vuejs.org/advanced/cookbook/adding-extra-pages.html"}],["meta",{"property":"og:url","content":"https://v2.vuepress.vuejs.org/zh/advanced/cookbook/adding-extra-pages.html"}],["meta",{"property":"og:site_name","content":"VuePress"}],["meta",{"property":"og:title","content":"添加额外页面"}],["meta",{"property":"og:description","content":"添加额外页面 有时你可能希望在不创建 Markdown 文件的情况下添加一些额外的页面。 我们可以借助于 和 来轻松实现。 添加默认的主页 作为一个主题作者,你可能不想要求用户必须创建一个 /README.md 文件来作为主页,但是你希望提供一个默认的主页:"}],["meta",{"property":"og:type","content":"article"}],["meta",{"property":"og:locale","content":"zh-CN"}],["meta",{"property":"og:locale:alternate","content":"en-US"}],["meta",{"property":"og:updated_time","content":"2023-12-28T05:20:14.000Z"}],["meta",{"property":"article:modified_time","content":"2023-12-28T05:20:14.000Z"}],["script",{"type":"application/ld+json"},"{\\"@context\\":\\"https://schema.org\\",\\"@type\\":\\"Article\\",\\"headline\\":\\"添加额外页面\\",\\"image\\":[\\"\\"],\\"dateModified\\":\\"2023-12-28T05:20:14.000Z\\",\\"author\\":[]}"]]},"headers":[{"level":2,"title":"添加默认的主页","slug":"添加默认的主页","link":"#添加默认的主页","children":[]}],"git":{"updatedTime":1703740814000,"contributors":[{"name":"meteorlxy","email":"meteor.lxy@foxmail.com","commits":2}]},"autoDesc":true,"filePathRelative":"zh/advanced/cookbook/adding-extra-pages.md"}');export{h as comp,g as data};
diff --git a/assets/adding-extra-pages.html-DyVLezP4.js b/assets/adding-extra-pages.html-DyVLezP4.js
new file mode 100644
index 000000000..9e663bd57
--- /dev/null
+++ b/assets/adding-extra-pages.html-DyVLezP4.js
@@ -0,0 +1,26 @@
+import{_ as o,r as t,o as p,c as r,a,b as s,d as n,w as l,e as i}from"./app-CqHoxGIc.js";const c={},d=a("h1",{id:"adding-extra-pages",tabindex:"-1"},[a("a",{class:"header-anchor",href:"#adding-extra-pages"},[a("span",null,"Adding Extra Pages")])],-1),D=a("p",null,"Sometimes you might want to add some extra pages without creating a markdown file in the source directory.",-1),y=i(`
',9),m=t("strong",null,"init",-1),g=t("li",null,"Theme and plugins will be loaded. That means all the plugins should be used before initialization.",-1),v=t("li",null,[e("In the "),t("strong",null,"prepare"),e(" stage: "),t("ul",null,[t("li",null,"Temp files will be generated, so all hooks related to client files will be processed here.")])],-1),f=t("strong",null,"dev / build",-1);function w(_,b){const o=a("RouteLink");return c(),p("div",null,[h,t("p",null,[e("The above figure shows the core process of VuePress Node App and the hooks of "),r(o,{to:"/reference/plugin-api.html"},{default:l(()=>[e("Plugin API")]),_:1}),e(":")]),t("ul",null,[t("li",null,[e("In the "),m,e(" stage: "),t("ul",null,[g,t("li",null,[e("As we are using markdown-it to parse the markdown file, so we need to create markdown-it instance before loading pages: "),t("ul",null,[t("li",null,[r(o,{to:"/reference/plugin-api.html#extendsmarkdownoptions"},{default:l(()=>[e("extendsMarkdownOptions")]),_:1}),e(" hook will be processed to create markdown-it instance.")]),t("li",null,[r(o,{to:"/reference/plugin-api.html#extendsmarkdown"},{default:l(()=>[e("extendsMarkdown")]),_:1}),e(" hook will be processed extends markdown-it instance.")])])]),t("li",null,[e("Page files will be loaded: "),t("ul",null,[t("li",null,[r(o,{to:"/reference/plugin-api.html#extendspageoptions"},{default:l(()=>[e("extendsPageOptions")]),_:1}),e(" hook will be processed to create pages.")]),t("li",null,[r(o,{to:"/reference/plugin-api.html#extendspage"},{default:l(()=>[e("extendsPage")]),_:1}),e(" hook will be processed to extends page object.")])])])])]),v,t("li",null,[e("In the "),f,e(" stage: "),t("ul",null,[t("li",null,[e("Bundler will be resolved: "),t("ul",null,[t("li",null,[r(o,{to:"/reference/plugin-api.html#extendsbundleroptions"},{default:l(()=>[e("extendsBundlerOptions")]),_:1}),e(" hook will be processed to create bundler configuration.")]),t("li",null,[r(o,{to:"/reference/plugin-api.html#alias"},{default:l(()=>[e("alias")]),_:1}),e(" hook and "),r(o,{to:"/reference/plugin-api.html#define"},{default:l(()=>[e("define")]),_:1}),e(" hook would be used in bundler configuration, so they will be processed here.")])])])])])])])}const y=s(d,[["render",w],["__file","architecture.html.vue"]]),A=JSON.parse('{"path":"/advanced/architecture.html","title":"Architecture","lang":"en-US","frontmatter":{"description":"Architecture Overview vuepress-architecture-overview The above figure shows a brief overview of the VuePress architecture: Node App will generate temp files, including the pages...","head":[["link",{"rel":"alternate","hreflang":"zh-cn","href":"https://v2.vuepress.vuejs.org/zh/advanced/architecture.html"}],["meta",{"property":"og:url","content":"https://v2.vuepress.vuejs.org/advanced/architecture.html"}],["meta",{"property":"og:site_name","content":"VuePress"}],["meta",{"property":"og:title","content":"Architecture"}],["meta",{"property":"og:description","content":"Architecture Overview vuepress-architecture-overview The above figure shows a brief overview of the VuePress architecture: Node App will generate temp files, including the pages..."}],["meta",{"property":"og:type","content":"article"}],["meta",{"property":"og:image","content":"https://v2.vuepress.vuejs.org/images/guide/vuepress-architecture-overview.png"}],["meta",{"property":"og:locale","content":"en-US"}],["meta",{"property":"og:locale:alternate","content":"zh-CN"}],["meta",{"property":"og:updated_time","content":"2024-02-05T05:23:13.000Z"}],["meta",{"property":"article:modified_time","content":"2024-02-05T05:23:13.000Z"}],["script",{"type":"application/ld+json"},"{\\"@context\\":\\"https://schema.org\\",\\"@type\\":\\"Article\\",\\"headline\\":\\"Architecture\\",\\"image\\":[\\"https://v2.vuepress.vuejs.org/images/guide/vuepress-architecture-overview.png\\",\\"https://v2.vuepress.vuejs.org/images/guide/vuepress-core-process.png\\"],\\"dateModified\\":\\"2024-02-05T05:23:13.000Z\\",\\"author\\":[]}"]]},"headers":[{"level":2,"title":"Overview","slug":"overview","link":"#overview","children":[]},{"level":2,"title":"Core Process and Hooks","slug":"core-process-and-hooks","link":"#core-process-and-hooks","children":[]}],"git":{"updatedTime":1707110593000,"contributors":[{"name":"meteorlxy","email":"meteor.lxy@foxmail.com","commits":2},{"name":"Mr.Hope","email":"mister-hope@outlook.com","commits":1}]},"autoDesc":true,"filePathRelative":"advanced/architecture.md"}');export{y as comp,A as data};
diff --git a/assets/architecture.html-CbsChR0W.js b/assets/architecture.html-CbsChR0W.js
new file mode 100644
index 000000000..c8633b526
--- /dev/null
+++ b/assets/architecture.html-CbsChR0W.js
@@ -0,0 +1 @@
+import{_ as n,a as s}from"./vuepress-core-process-C4qfrYlz.js";import{_ as a,r as i,o as p,c as u,a as t,b as e,d as r,w as o,e as c}from"./app-CqHoxGIc.js";const d={},h=c('
<img src="@alias/image.png" alt="Image from path alias">
`,11),A={class:"hint-container tip"},w=e("p",{class:"hint-container-title"},"Tips",-1);function x(F,P){const a=p("RouteLink");return i(),c("div",null,[u,e("p",null,[s("The default public directory is "),D,s(", which can be changed by "),n(a,{to:"/reference/config.html#public"},{default:l(()=>[s("public")]),_:1}),s(" option.")]),m,e("p",null,[s("If your site is deployed to a non-root URL, for example, "),y,s(", then the "),n(a,{to:"/reference/config.html#base"},{default:l(()=>[s("base")]),_:1}),s(" should be set to "),h,s(". Obviously, your public files would be served like "),g,s(" after deployment.")]),v,e("div",b,[C,e("p",null,[s("When using "),n(a,{to:"/reference/bundler/webpack.html"},{default:l(()=>[s("webpack bundler")]),_:1}),s(", you need to set "),n(a,{to:"/reference/config.html#markdown-assets"},{default:l(()=>[s("markdown.assets.absolutePathPrependBase")]),_:1}),s(" to "),f,s(" to automatically prepend base to markdown images.")])]),e("p",null,[s("However, sometimes you may have some dynamical links referencing public files, especially when you are authoring a custom theme. In such case, the "),k,s(" could not be handled automatically. To help with that, VuePress provides a "),n(a,{to:"/reference/client-api.html#withbase"},{default:l(()=>[s("withBase")]),_:1}),s(" helper to prepend "),E,s(" for you:")]),_,e("div",A,[w,e("p",null,[s("Config reference: "),n(a,{to:"/reference/plugin-api.html#alias"},{default:l(()=>[s("alias")]),_:1})])])])}const q=r(d,[["render",x],["__file","assets.html.vue"]]),T=JSON.parse('{"path":"/guide/assets.html","title":"Assets","lang":"en-US","frontmatter":{"description":"Assets Relative URLs You can reference any assets using relative URLs in your Markdown content: or This is generally the suggested way to import images, as users usually place i...","head":[["link",{"rel":"alternate","hreflang":"zh-cn","href":"https://v2.vuepress.vuejs.org/zh/guide/assets.html"}],["meta",{"property":"og:url","content":"https://v2.vuepress.vuejs.org/guide/assets.html"}],["meta",{"property":"og:site_name","content":"VuePress"}],["meta",{"property":"og:title","content":"Assets"}],["meta",{"property":"og:description","content":"Assets Relative URLs You can reference any assets using relative URLs in your Markdown content: or This is generally the suggested way to import images, as users usually place i..."}],["meta",{"property":"og:type","content":"article"}],["meta",{"property":"og:image","content":"https://v2.vuepress.vuejs.org/images/hero.png"}],["meta",{"property":"og:locale","content":"en-US"}],["meta",{"property":"og:locale:alternate","content":"zh-CN"}],["meta",{"property":"og:updated_time","content":"2024-08-31T07:59:53.000Z"}],["meta",{"property":"article:modified_time","content":"2024-08-31T07:59:53.000Z"}],["script",{"type":"application/ld+json"},"{\\"@context\\":\\"https://schema.org\\",\\"@type\\":\\"Article\\",\\"headline\\":\\"Assets\\",\\"image\\":[\\"https://v2.vuepress.vuejs.org/images/hero.png\\",\\"https://v2.vuepress.vuejs.org/images/hero.png\\",\\"https://v2.vuepress.vuejs.org/images/hero.png\\"],\\"dateModified\\":\\"2024-08-31T07:59:53.000Z\\",\\"author\\":[]}"]]},"headers":[{"level":2,"title":"Relative URLs","slug":"relative-urls","link":"#relative-urls","children":[]},{"level":2,"title":"Public Files","slug":"public-files","link":"#public-files","children":[{"level":3,"title":"Base Helper","slug":"base-helper","link":"#base-helper","children":[]}]},{"level":2,"title":"Packages and Path Aliases","slug":"packages-and-path-aliases","link":"#packages-and-path-aliases","children":[]}],"git":{"updatedTime":1725091193000,"contributors":[{"name":"meteorlxy","email":"meteor.lxy@foxmail.com","commits":4},{"name":"Mr.Hope","email":"mister-hope@outlook.com","commits":1}]},"autoDesc":true,"filePathRelative":"guide/assets.md"}');export{q as comp,T as data};
diff --git a/assets/assets.html-CYHEojlm.js b/assets/assets.html-CYHEojlm.js
new file mode 100644
index 000000000..c83cc8007
--- /dev/null
+++ b/assets/assets.html-CYHEojlm.js
@@ -0,0 +1,24 @@
+import{_ as t}from"./hero-BNkrhNQ6.js";import{_ as p,r,o as i,c,a as e,b as s,d as n,w as l,e as o}from"./app-CqHoxGIc.js";const d={},D=o('
VuePress supports using Webpack or Vite to dev and build sites. You can choose which bundler to use according to your preference, and no extra configuration is required.
When installing the vuepress package, no bundlers will be installed. You need to choose a bundler to install.
',4),h=e("div",{class:"language-bash line-numbers-mode","data-highlighter":"shiki","data-ext":"bash","data-title":"bash",style:{"background-color":"#1E1E1E",color:"#D4D4D4"}},[e("pre",{class:"shiki dark-plus vp-code"},[e("code",null,[e("span",{class:"line"},[e("span",{style:{color:"#6A9955"}},"# install vite bundler")]),s(`
+`),e("span",{class:"line"},[e("span",{style:{color:"#DCDCAA"}},"pnpm"),e("span",{style:{color:"#CE9178"}}," add"),e("span",{style:{color:"#569CD6"}}," -D"),e("span",{style:{color:"#CE9178"}}," vuepress@next"),e("span",{style:{color:"#CE9178"}}," @vuepress/bundler-vite@next")]),s(`
+`),e("span",{class:"line"},[e("span",{style:{color:"#6A9955"}},"# install webpack bundler")]),s(`
+`),e("span",{class:"line"},[e("span",{style:{color:"#DCDCAA"}},"pnpm"),e("span",{style:{color:"#CE9178"}}," add"),e("span",{style:{color:"#569CD6"}}," -D"),e("span",{style:{color:"#CE9178"}}," vuepress@next"),e("span",{style:{color:"#CE9178"}}," @vuepress/bundler-webpack@next")])])]),e("div",{class:"line-numbers","aria-hidden":"true",style:{"counter-reset":"line-number 0"}},[e("div",{class:"line-number"}),e("div",{class:"line-number"}),e("div",{class:"line-number"}),e("div",{class:"line-number"})])],-1),m=e("div",{class:"language-bash line-numbers-mode","data-highlighter":"shiki","data-ext":"bash","data-title":"bash",style:{"background-color":"#1E1E1E",color:"#D4D4D4"}},[e("pre",{class:"shiki dark-plus vp-code"},[e("code",null,[e("span",{class:"line"},[e("span",{style:{color:"#6A9955"}},"# install vite bundler")]),s(`
+`),e("span",{class:"line"},[e("span",{style:{color:"#DCDCAA"}},"yarn"),e("span",{style:{color:"#CE9178"}}," add"),e("span",{style:{color:"#569CD6"}}," -D"),e("span",{style:{color:"#CE9178"}}," vuepress@next"),e("span",{style:{color:"#CE9178"}}," @vuepress/bundler-vite@next")]),s(`
+`),e("span",{class:"line"},[e("span",{style:{color:"#6A9955"}},"# install webpack bundler")]),s(`
+`),e("span",{class:"line"},[e("span",{style:{color:"#DCDCAA"}},"yarn"),e("span",{style:{color:"#CE9178"}}," add"),e("span",{style:{color:"#569CD6"}}," -D"),e("span",{style:{color:"#CE9178"}}," vuepress@next"),e("span",{style:{color:"#CE9178"}}," @vuepress/bundler-webpack@next")])])]),e("div",{class:"line-numbers","aria-hidden":"true",style:{"counter-reset":"line-number 0"}},[e("div",{class:"line-number"}),e("div",{class:"line-number"}),e("div",{class:"line-number"}),e("div",{class:"line-number"})])],-1),v=e("div",{class:"language-bash line-numbers-mode","data-highlighter":"shiki","data-ext":"bash","data-title":"bash",style:{"background-color":"#1E1E1E",color:"#D4D4D4"}},[e("pre",{class:"shiki dark-plus vp-code"},[e("code",null,[e("span",{class:"line"},[e("span",{style:{color:"#6A9955"}},"# install vite bundler")]),s(`
+`),e("span",{class:"line"},[e("span",{style:{color:"#DCDCAA"}},"npm"),e("span",{style:{color:"#CE9178"}}," install"),e("span",{style:{color:"#569CD6"}}," -D"),e("span",{style:{color:"#CE9178"}}," vuepress@next"),e("span",{style:{color:"#CE9178"}}," @vuepress/bundler-vite@next")]),s(`
+`),e("span",{class:"line"},[e("span",{style:{color:"#6A9955"}},"# install webpack bundler")]),s(`
+`),e("span",{class:"line"},[e("span",{style:{color:"#DCDCAA"}},"npm"),e("span",{style:{color:"#CE9178"}}," install"),e("span",{style:{color:"#569CD6"}}," -D"),e("span",{style:{color:"#CE9178"}}," vuepress@next"),e("span",{style:{color:"#CE9178"}}," @vuepress/bundler-webpack@next")])])]),e("div",{class:"line-numbers","aria-hidden":"true",style:{"counter-reset":"line-number 0"}},[e("div",{class:"line-number"}),e("div",{class:"line-number"}),e("div",{class:"line-number"}),e("div",{class:"line-number"})])],-1),y=e("h2",{id:"use-a-bundler",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#use-a-bundler"},[e("span",null,"Use a Bundler")])],-1),g=e("p",null,"Generally, you could use a bundler without extra configuration, because we have already configured them properly to work with VuePress.",-1),C=o(`
When you need to customize the bundler, you can set the corresponding options:
`,2);function D(_,f){const a=r("CodeGroupItem"),i=r("CodeGroup"),t=r("RouteLink");return p(),d("div",null,[b,n(i,null,{default:l(()=>[n(a,{title:"pnpm",active:""},{default:l(()=>[h]),_:1}),n(a,{title:"yarn"},{default:l(()=>[m]),_:1}),n(a,{title:"npm"},{default:l(()=>[v]),_:1})]),_:1}),y,g,e("p",null,[s("You can use a bundler via the "),n(t,{to:"/reference/config.html#bundler"},{default:l(()=>[s("bundler")]),_:1}),s(" option:")]),C,e("ul",null,[e("li",null,[n(t,{to:"/reference/bundler/vite.html"},{default:l(()=>[s("Bundlers > Vite")]),_:1})]),e("li",null,[n(t,{to:"/reference/bundler/webpack.html"},{default:l(()=>[s("Bundlers > Webpack")]),_:1})])])])}const E=c(u,[["render",D],["__file","bundler.html.vue"]]),x=JSON.parse('{"path":"/guide/bundler.html","title":"Bundler","lang":"en-US","frontmatter":{"description":"Bundler VuePress supports using Webpack or Vite to dev and build sites. You can choose which bundler to use according to your preference, and no extra configuration is required....","head":[["link",{"rel":"alternate","hreflang":"zh-cn","href":"https://v2.vuepress.vuejs.org/zh/guide/bundler.html"}],["meta",{"property":"og:url","content":"https://v2.vuepress.vuejs.org/guide/bundler.html"}],["meta",{"property":"og:site_name","content":"VuePress"}],["meta",{"property":"og:title","content":"Bundler"}],["meta",{"property":"og:description","content":"Bundler VuePress supports using Webpack or Vite to dev and build sites. You can choose which bundler to use according to your preference, and no extra configuration is required...."}],["meta",{"property":"og:type","content":"article"}],["meta",{"property":"og:locale","content":"en-US"}],["meta",{"property":"og:locale:alternate","content":"zh-CN"}],["meta",{"property":"og:updated_time","content":"2023-12-28T04:39:48.000Z"}],["meta",{"property":"article:modified_time","content":"2023-12-28T04:39:48.000Z"}],["script",{"type":"application/ld+json"},"{\\"@context\\":\\"https://schema.org\\",\\"@type\\":\\"Article\\",\\"headline\\":\\"Bundler\\",\\"image\\":[\\"\\"],\\"dateModified\\":\\"2023-12-28T04:39:48.000Z\\",\\"author\\":[]}"]]},"headers":[{"level":2,"title":"Install a Bundler","slug":"install-a-bundler","link":"#install-a-bundler","children":[]},{"level":2,"title":"Use a Bundler","slug":"use-a-bundler","link":"#use-a-bundler","children":[]}],"git":{"updatedTime":1703738388000,"contributors":[{"name":"meteorlxy","email":"meteor.lxy@foxmail.com","commits":2}]},"autoDesc":true,"filePathRelative":"guide/bundler.md"}');export{E as comp,x as data};
diff --git a/assets/bundler.html-CxqWeejo.js b/assets/bundler.html-CxqWeejo.js
new file mode 100644
index 000000000..415fc512d
--- /dev/null
+++ b/assets/bundler.html-CxqWeejo.js
@@ -0,0 +1,16 @@
+import{_ as c,r,o as i,c as d,d as n,w as l,a as e,b as s,e as o}from"./app-CqHoxGIc.js";const u={},m=o('
Run vuepress --help to get following help messages:
Usage:
+ $ vuepress <command> [options]
+
+Commands:
+ dev [sourceDir] Start development server
+ build [sourceDir] Build to static site
+ info Display environment information
+
+For more info, run any command with the \`--help\` flag:
+ $ vuepress dev --help
+ $ vuepress build --help
+ $ vuepress info --help
+
+Options:
+ -v, --version Display version number
+ -h, --help Display this message
Start a development server to develop your VuePress site locally.
Usage:
+ $ vuepress dev [sourceDir]
+
+Options:
+ -c, --config <config> Set path to config file
+ -p, --port <port> Use specified port (default: 8080)
+ -t, --temp <temp> Set the directory of the temporary files
+ --host <host> Use specified host (default: 0.0.0.0)
+ --cache <cache> Set the directory of the cache files
+ --clean-temp Clean the temporary files before dev
+ --clean-cache Clean the cache files before dev
+ --open Open browser when ready
+ --debug Enable debug mode
+ --no-watch Disable watching page and config files (default: true)
+ -v, --version Display version number
+ -h, --help Display this message
Tips
Options set by CLI will override those options with the same name in your config file.
Usage:
+ $ vuepress build [sourceDir]
+
+Options:
+ -c, --config <config> Set path to config file
+ -d, --dest <dest> Set the directory build output (default: .vuepress/dist)
+ -t, --temp <temp> Set the directory of the temporary files
+ --cache <cache> Set the directory of the cache files
+ --clean-temp Clean the temporary files before build
+ --clean-cache Clean the cache files before build
+ --debug Enable debug mode
+ -v, --version Display version number
+ -h, --help Display this message
Tips
Options set by CLI will override those options with the same name in your config file.
Outputs information about your system and dependencies.
This command would be helpful when you want to check your environment or report an issue.
`,5);function v(m,h){const s=i("RouteLink");return l(),p("div",null,[o,t("p",null,[e("Build your VuePress site to static files, which are ready for "),r(s,{to:"/guide/deployment.html"},{default:c(()=>[e("deployment")]),_:1}),e(".")]),u])}const g=a(d,[["render",v],["__file","cli.html.vue"]]),f=JSON.parse('{"path":"/reference/cli.html","title":"Command Line Interface","lang":"en-US","frontmatter":{"description":"Command Line Interface Run vuepress --help to get following help messages: Tips VuePress is using debug module. Set environment variable DEBUG=vuepress* to enable debug logs. de...","head":[["link",{"rel":"alternate","hreflang":"zh-cn","href":"https://v2.vuepress.vuejs.org/zh/reference/cli.html"}],["meta",{"property":"og:url","content":"https://v2.vuepress.vuejs.org/reference/cli.html"}],["meta",{"property":"og:site_name","content":"VuePress"}],["meta",{"property":"og:title","content":"Command Line Interface"}],["meta",{"property":"og:description","content":"Command Line Interface Run vuepress --help to get following help messages: Tips VuePress is using debug module. Set environment variable DEBUG=vuepress* to enable debug logs. de..."}],["meta",{"property":"og:type","content":"article"}],["meta",{"property":"og:locale","content":"en-US"}],["meta",{"property":"og:locale:alternate","content":"zh-CN"}],["meta",{"property":"og:updated_time","content":"2024-02-06T15:46:43.000Z"}],["meta",{"property":"article:modified_time","content":"2024-02-06T15:46:43.000Z"}],["script",{"type":"application/ld+json"},"{\\"@context\\":\\"https://schema.org\\",\\"@type\\":\\"Article\\",\\"headline\\":\\"Command Line Interface\\",\\"image\\":[\\"\\"],\\"dateModified\\":\\"2024-02-06T15:46:43.000Z\\",\\"author\\":[]}"]]},"headers":[{"level":2,"title":"dev","slug":"dev","link":"#dev","children":[]},{"level":2,"title":"build","slug":"build","link":"#build","children":[]},{"level":2,"title":"info","slug":"info","link":"#info","children":[]}],"git":{"updatedTime":1707234403000,"contributors":[{"name":"meteorlxy","email":"meteor.lxy@foxmail.com","commits":3},{"name":"Mr.Hope","email":"mister-hope@outlook.com","commits":1}]},"autoDesc":true,"filePathRelative":"reference/cli.md"}');export{g as comp,f as data};
diff --git a/assets/cli.html-CL4VepSP.js b/assets/cli.html-CL4VepSP.js
new file mode 100644
index 000000000..d0460604e
--- /dev/null
+++ b/assets/cli.html-CL4VepSP.js
@@ -0,0 +1,43 @@
+import{_ as a,r as i,o as l,c as p,a as t,b as e,d as r,w as c,e as s}from"./app-CqHoxGIc.js";const d={},o=s(`
Usage:
+ $ vuepress <command> [options]
+
+Commands:
+ dev [sourceDir] Start development server
+ build [sourceDir] Build to static site
+ info Display environment information
+
+For more info, run any command with the \`--help\` flag:
+ $ vuepress dev --help
+ $ vuepress build --help
+ $ vuepress info --help
+
+Options:
+ -v, --version Display version number
+ -h, --help Display this message
Usage:
+ $ vuepress dev [sourceDir]
+
+Options:
+ -c, --config <config> Set path to config file
+ -p, --port <port> Use specified port (default: 8080)
+ -t, --temp <temp> Set the directory of the temporary files
+ --host <host> Use specified host (default: 0.0.0.0)
+ --cache <cache> Set the directory of the cache files
+ --clean-temp Clean the temporary files before dev
+ --clean-cache Clean the cache files before dev
+ --open Open browser when ready
+ --debug Enable debug mode
+ --no-watch Disable watching page and config files (default: true)
+ -v, --version Display version number
+ -h, --help Display this message
Usage:
+ $ vuepress build [sourceDir]
+
+Options:
+ -c, --config <config> Set path to config file
+ -d, --dest <dest> Set the directory build output (default: .vuepress/dist)
+ -t, --temp <temp> Set the directory of the temporary files
+ --cache <cache> Set the directory of the cache files
+ --clean-temp Clean the temporary files before build
+ --clean-cache Clean the cache files before build
+ --debug Enable debug mode
+ -v, --version Display version number
+ -h, --help Display this message
`,7),h=e("li",null,[e("p",null,"Details:"),e("p",null,"Returns the page data ref object of current page.")],-1),v=e("p",null,"Also see:",-1),D=e("h3",{id:"usepagefrontmatter",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#usepagefrontmatter"},[e("span",null,"usePageFrontmatter")])],-1),g=e("ul",null,[e("li",null,[e("p",null,"Details:"),e("p",null,"Returns the frontmatter ref object of current page."),e("p",null,[s("The value is the "),e("code",null,"frontmatter"),s(" property of the page data.")])])],-1),f=e("h3",{id:"usepagehead",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#usepagehead"},[e("span",null,"usePageHead")])],-1),m=e("p",null,"Details:",-1),y=e("p",null,"Returns the head config ref object of current page.",-1),_=t('
',5),b=e("li",null,[e("p",null,"Details:"),e("p",null,"Returns the routes ref object."),e("p",null,[s("The value is the "),e("code",null,"routes"),s(" property of the site data.")])],-1),C=e("p",null,"Also see:",-1),k=e("h3",{id:"useroutelocale",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#useroutelocale"},[e("span",null,"useRouteLocale")])],-1),E=e("p",null,"Details:",-1),P=e("p",null,"Returns the locale path ref object of current route.",-1),F=t('
',6),x=e("p",null,"Details:",-1),A=e("p",null,"Also see:",-1),R=e("h3",{id:"resolveroute",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#resolveroute"},[e("span",null,"resolveRoute")])],-1),S=e("li",null,[e("p",null,"Details:"),e("p",null,"Parses the route of the given link.")],-1),T=e("p",null,"Also see:",-1),j=e("h2",{id:"resolveroutepath",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#resolveroutepath"},[e("span",null,"resolveRoutePath")])],-1),V=e("li",null,[e("p",null,"Details:"),e("p",null,"Parses the route path of the given link.")],-1),I=e("p",null,"Also see:",-1),w=e("h3",{id:"withbase",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#withbase"},[e("span",null,"withBase")])],-1),L=e("p",null,"Details:",-1),H=e("p",null,"Also see:",-1),U=t(`
resolvers will affect the basic functionality of VuePress. Please make sure you have fully understood its purpose before modifying it.
`,4);function M($,G){const n=o("RouteLink"),i=o("Badge");return p(),c("div",null,[u,e("ul",null,[h,e("li",null,[v,e("ul",null,[e("li",null,[l(n,{to:"/reference/node-api.html#data"},{default:a(()=>[s("Node API > Page Properties > data")]),_:1})]),e("li",null,[l(n,{to:"/reference/plugin-api.html#extendspage"},{default:a(()=>[s("Plugin API > extendsPage")]),_:1})])])])]),D,g,f,e("ul",null,[e("li",null,[m,y,e("p",null,[s("The value is obtained by merging and deduplicating "),l(n,{to:"/reference/frontmatter.html#head"},{default:a(()=>[s("head")]),_:1}),s(" frontmatter and "),l(n,{to:"/reference/config.html#head"},{default:a(()=>[s("head")]),_:1}),s(" config.")])])]),_,e("ul",null,[b,e("li",null,[C,e("ul",null,[e("li",null,[l(n,{to:"/advanced/cookbook/resolving-routes.html"},{default:a(()=>[s("Advanced > Cookbook > Resolving Routes")]),_:1})])])])]),k,e("ul",null,[e("li",null,[E,P,e("p",null,[s("The value is one of the keys of the "),l(n,{to:"/reference/config.html#locales"},{default:a(()=>[s("locales")]),_:1}),s(" config.")])])]),F,e("ul",null,[e("li",null,[x,e("p",null,[s("Helper for creating "),l(n,{to:"/reference/plugin-api.html#clientconfigfile"},{default:a(()=>[s("clientConfigFile")]),_:1}),s(".")])]),e("li",null,[A,e("ul",null,[e("li",null,[l(n,{to:"/advanced/cookbook/usage-of-client-config.html"},{default:a(()=>[s("Advanced > Cookbook > Usage of Client Config")]),_:1})])])])]),R,e("ul",null,[S,e("li",null,[T,e("ul",null,[e("li",null,[l(n,{to:"/advanced/cookbook/resolving-routes.html"},{default:a(()=>[s("Advanced > Cookbook > Resolving Routes")]),_:1})])])])]),j,e("ul",null,[V,e("li",null,[I,e("ul",null,[e("li",null,[l(n,{to:"/advanced/cookbook/resolving-routes.html"},{default:a(()=>[s("Advanced > Cookbook > Resolving Routes")]),_:1})])])])]),w,e("ul",null,[e("li",null,[L,e("p",null,[s("Prefix URL with site "),l(n,{to:"/reference/config.html#base"},{default:a(()=>[s("base")]),_:1}),s(".")])]),e("li",null,[H,e("ul",null,[e("li",null,[l(n,{to:"/guide/assets.html#base-helper"},{default:a(()=>[s("Guide > Assets > Base Helper")]),_:1})])])])]),U,e("ul",null,[B,e("li",null,[N,e("p",null,[s("The "),l(n,{to:"/reference/config.html#base"},{default:a(()=>[s("base")]),_:1}),s(" option from config.")])])]),q,e("h3",z,[e("a",O,[e("span",null,[s("resolvers "),l(i,{text:"experimental"})])])]),Z])}const K=r(d,[["render",M],["__file","client-api.html.vue"]]),Q=JSON.parse('{"path":"/reference/client-api.html","title":"Client API","lang":"en-US","frontmatter":{"description":"Client API Client API can be imported from vuepress/client. Composition API useClientData Details: Returns all the client data ref objects. Each property can also be accessed by...","head":[["link",{"rel":"alternate","hreflang":"zh-cn","href":"https://v2.vuepress.vuejs.org/zh/reference/client-api.html"}],["meta",{"property":"og:url","content":"https://v2.vuepress.vuejs.org/reference/client-api.html"}],["meta",{"property":"og:site_name","content":"VuePress"}],["meta",{"property":"og:title","content":"Client API"}],["meta",{"property":"og:description","content":"Client API Client API can be imported from vuepress/client. Composition API useClientData Details: Returns all the client data ref objects. Each property can also be accessed by..."}],["meta",{"property":"og:type","content":"article"}],["meta",{"property":"og:locale","content":"en-US"}],["meta",{"property":"og:locale:alternate","content":"zh-CN"}],["meta",{"property":"og:updated_time","content":"2024-05-24T08:18:58.000Z"}],["meta",{"property":"article:modified_time","content":"2024-05-24T08:18:58.000Z"}],["script",{"type":"application/ld+json"},"{\\"@context\\":\\"https://schema.org\\",\\"@type\\":\\"Article\\",\\"headline\\":\\"Client API\\",\\"image\\":[\\"\\"],\\"dateModified\\":\\"2024-05-24T08:18:58.000Z\\",\\"author\\":[]}"]]},"headers":[{"level":2,"title":"Composition API","slug":"composition-api","link":"#composition-api","children":[{"level":3,"title":"useClientData","slug":"useclientdata","link":"#useclientdata","children":[]},{"level":3,"title":"usePageData","slug":"usepagedata","link":"#usepagedata","children":[]},{"level":3,"title":"usePageFrontmatter","slug":"usepagefrontmatter","link":"#usepagefrontmatter","children":[]},{"level":3,"title":"usePageHead","slug":"usepagehead","link":"#usepagehead","children":[]},{"level":3,"title":"usePageHeadTitle","slug":"usepageheadtitle","link":"#usepageheadtitle","children":[]},{"level":3,"title":"usePageLang","slug":"usepagelang","link":"#usepagelang","children":[]}]},{"level":2,"title":"useRoutes","slug":"useroutes","link":"#useroutes","children":[{"level":3,"title":"useRouteLocale","slug":"useroutelocale","link":"#useroutelocale","children":[]},{"level":3,"title":"useSiteData","slug":"usesitedata","link":"#usesitedata","children":[]},{"level":3,"title":"useSiteLocaleData","slug":"usesitelocaledata","link":"#usesitelocaledata","children":[]}]},{"level":2,"title":"Helpers","slug":"helpers","link":"#helpers","children":[{"level":3,"title":"defineClientConfig","slug":"defineclientconfig","link":"#defineclientconfig","children":[]},{"level":3,"title":"resolveRoute","slug":"resolveroute","link":"#resolveroute","children":[]}]},{"level":2,"title":"resolveRoutePath","slug":"resolveroutepath","link":"#resolveroutepath","children":[{"level":3,"title":"withBase","slug":"withbase","link":"#withbase","children":[]}]},{"level":2,"title":"Constants","slug":"constants","link":"#constants","children":[{"level":3,"title":"__VUEPRESS_VERSION__","slug":"vuepress-version","link":"#vuepress-version","children":[]},{"level":3,"title":"__VUEPRESS_BASE__","slug":"vuepress-base","link":"#vuepress-base","children":[]},{"level":3,"title":"__VUEPRESS_DEV__","slug":"vuepress-dev","link":"#vuepress-dev","children":[]},{"level":3,"title":"__VUEPRESS_SSR__","slug":"vuepress-ssr","link":"#vuepress-ssr","children":[]}]},{"level":2,"title":"Advanced","slug":"advanced","link":"#advanced","children":[{"level":3,"title":"resolvers","slug":"resolvers","link":"#resolvers","children":[]}]}],"git":{"updatedTime":1716538738000,"contributors":[{"name":"meteorlxy","email":"meteor.lxy@foxmail.com","commits":5},{"name":"Mister-Hope","email":"mister-hope@outlook.com","commits":1}]},"autoDesc":true,"filePathRelative":"reference/client-api.md"}');export{K as comp,Q as data};
diff --git a/assets/components.html-CbNhUHdN.js b/assets/components.html-CbNhUHdN.js
new file mode 100644
index 000000000..b04fbdd3d
--- /dev/null
+++ b/assets/components.html-CbNhUHdN.js
@@ -0,0 +1,56 @@
+import{_ as a,r as o,o as t,c as p,a as s,d as i,w as c,e as l,b as n}from"./app-CqHoxGIc.js";const r={},d=l(`
interface AutoLinkConfig {
+ /**
+ * Pattern to determine if the link should be active, which has higher priority than \`exact\`
+ */
+ activeMatch?: RegExp | string
+
+ /**
+ * The \`aria-label\` attribute
+ */
+ ariaLabel?: string
+
+ /**
+ * Whether the link should be active only if the url is an exact match
+ */
+ exact?: boolean
+
+ /**
+ * URL of the auto link
+ */
+ link: string
+
+ /**
+ * The \`rel\` attribute
+ */
+ rel?: string
+
+ /**
+ * The \`target\` attribute
+ */
+ target?: string
+
+ /**
+ * Text of the auto link
+ */
+ text: string
+}
This component will automatically render internal link as <RouteLink>, and render external link as <a>. It will also add necessary attributes correspondingly.
You can make use of the before and after slots to render content before and after the text. Also, you can use the default slot to render the text (default text is config.text).
This component is mainly for developing themes. Users won't need it in most cases. For theme authors, it's recommended to use this component to render links that could be either internal or external.
This component and its children will only be rendered in client-side. That means, it will not be rendered to HTML during build (SSR).
If a component is trying to access Browser / DOM APIs directly in setup(), an error will occur during build because those APIs are unavailable in Node.js environment. In such case, you could do either:
Modify the component to only access Browser / DOM APIs in onBeforeMount() or onMounted() hook.
`,14),u=s("li",null,[s("p",null,"Details:"),s("p",null,"This component will render the Markdown content of a page."),s("p",null,[n("If the "),s("code",null,"path"),n(" prop is not provided, it will render the page content of current route.")]),s("p",null,"This component is mainly for developing themes. You won't need it in most cases.")],-1),y=s("p",null,"Also see:",-1),m=e(`
<RouteLink to="/path/to/target-page.md">target page</RouteLink>
+<RouteLink active to="/path/to/current-page.md">current page</RouteLink>
Details:
This component will render a link to the target page.
If the active prop is set to true, the link will have an extra activeClass. Notice that the active status won't be updated automatically when the route changes.
This component is mainly for developing themes. Users won't need it in most cases. For theme authors, it's recommended to use this component to render internal links instead of the <RouterLink> component from vue-router.
`,4);function v(h,D){const l=o("RouteLink");return t(),i("div",null,[d,s("ul",null,[u,s("li",null,[y,s("ul",null,[s("li",null,[p(l,{to:"/reference/node-api.html#path"},{default:c(()=>[n("Node API > Page Properties > path")]),_:1})])])])]),m])}const C=a(r,[["render",v],["__file","components.html.vue"]]),b=JSON.parse('{"path":"/reference/components.html","title":"Built-in Components","lang":"en-US","frontmatter":{"description":"Built-in Components AutoLink Props: config Type: AutoLinkConfig Required: true Usage: Details: This component will automatically render internal link as , and render ...","head":[["link",{"rel":"alternate","hreflang":"zh-cn","href":"https://v2.vuepress.vuejs.org/zh/reference/components.html"}],["meta",{"property":"og:url","content":"https://v2.vuepress.vuejs.org/reference/components.html"}],["meta",{"property":"og:site_name","content":"VuePress"}],["meta",{"property":"og:title","content":"Built-in Components"}],["meta",{"property":"og:description","content":"Built-in Components AutoLink Props: config Type: AutoLinkConfig Required: true Usage: Details: This component will automatically render internal link as , and render ..."}],["meta",{"property":"og:type","content":"article"}],["meta",{"property":"og:locale","content":"en-US"}],["meta",{"property":"og:locale:alternate","content":"zh-CN"}],["meta",{"property":"og:updated_time","content":"2024-08-31T07:59:53.000Z"}],["meta",{"property":"article:modified_time","content":"2024-08-31T07:59:53.000Z"}],["script",{"type":"application/ld+json"},"{\\"@context\\":\\"https://schema.org\\",\\"@type\\":\\"Article\\",\\"headline\\":\\"Built-in Components\\",\\"image\\":[\\"\\"],\\"dateModified\\":\\"2024-08-31T07:59:53.000Z\\",\\"author\\":[]}"]]},"headers":[{"level":2,"title":"AutoLink","slug":"autolink","link":"#autolink","children":[]},{"level":2,"title":"ClientOnly","slug":"clientonly","link":"#clientonly","children":[]},{"level":2,"title":"Content","slug":"content","link":"#content","children":[]},{"level":2,"title":"RouteLink","slug":"routelink","link":"#routelink","children":[]}],"git":{"updatedTime":1725091193000,"contributors":[{"name":"meteorlxy","email":"meteor.lxy@foxmail.com","commits":4},{"name":"Mr.Hope","email":"mister-hope@outlook.com","commits":1},{"name":"张怀文","email":"mister-hope@outlook.com","commits":1}]},"autoDesc":true,"filePathRelative":"reference/components.md"}');export{C as comp,b as data};
diff --git a/assets/config.html-BfxQAIgY.js b/assets/config.html-BfxQAIgY.js
new file mode 100644
index 000000000..f00364f23
--- /dev/null
+++ b/assets/config.html-BfxQAIgY.js
@@ -0,0 +1,15 @@
+import{_ as a,r as s,o as r,c as d,a as e,d as t,w as i,b as l,e as o}from"./app-CqHoxGIc.js";const p={},c=o('
You will need to set this if you plan to deploy your site under a sub path. It should always start and end with a slash. For example, if you plan to deploy your site to GitHub pages at https://foo.github.io/bar/, then you should set base to "/bar/".
The base is automatically prepended to the URLs that start with / in other options, so you only need to specify it once. (Except for attrs of head)
Notice that base should be an absolute URL pathname starting and ending with / .
This will be the content attribute of <meta name="description" /> tag in the rendered HTML, which will be overrode by the description field of page frontmatter.
',3),T=e("p",null,"Also see:",-1),E=e("h2",{id:"theme-config",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#theme-config"},[e("span",null,"Theme Config")])],-1),P=e("h3",{id:"theme",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#theme"},[e("span",null,"theme")])],-1),A=e("li",null,[e("p",null,[l("Type: "),e("code",null,"Theme")])],-1),S=e("li",null,[e("p",null,"Details:"),e("p",null,"Set the theme of your site."),e("p",null,"If this option is not set, the default theme will be used.")],-1),B=e("p",null,"Also see:",-1),F=e("li",null,[e("a",{href:"https://ecosystem.vuejs.press/themes/default/config.html",target:"_blank",rel:"noopener noreferrer"},"Default Theme > Config")],-1),O=e("h2",{id:"bundler-config",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#bundler-config"},[e("span",null,"Bundler Config")])],-1),L=e("h3",{id:"bundler",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#bundler"},[e("span",null,"bundler")])],-1),M=o("
Type: Bundler
Details:
Set the bundler of your site.
If this option is not set, the default bundler will be used:
With vuepress or vuepress-vite, the default bundler is vite.
With vuepress-webpack, the default bundler is webpack.
',9),G=e("li",null,[e("p",null,[l("Type: "),e("code",null,"string")])],-1),j=e("li",null,[e("p",null,[l("Default: "),e("code",null,"`${sourceDir}/.vuepress/public`")])],-1),V=e("li",null,[e("p",null,"Details:"),e("p",null,"Specify the directory for public files.")],-1),q=e("p",null,"Also see:",-1),H=o('
This would be helpful for developers. Also, we are using debug package for debug logging, which can be enabled via DEBUG=vuepress* environment variable.
A function to control what files should have <link rel="prefetch"> resource hints generated. Set to true or false to enable or disable for all files.
If you set it to true, all files that required by other pages will be prefetched. This is good for small sites, which will speed up the navigation, but it might not be a good idea if you have lots of pages in your site.
It accepts all options of markdown-it, and the following additional options.
',3),$=e("p",null,"Also see:",-1),z=e("li",null,[e("a",{href:"https://github.com/markdown-it/markdown-it#init-with-presets-and-options",target:"_blank",rel:"noopener noreferrer"},"markdown-it > Init with presets and options")],-1),Z=o(`
`,3),J=e("li",null,[e("p",null,"Details:"),e("p",null,[l("Options for "),e("a",{href:"https://github.com/valeriangalliat/markdown-it-anchor",target:"_blank",rel:"noopener noreferrer"},"markdown-it-anchor"),l(".")]),e("p",null,[l("Set to "),e("code",null,"false"),l(" to disable this plugin.")])],-1),K=e("p",null,"Also see:",-1),Q=o('
',7),X=e("li",null,[e("p",null,[l("Type: "),e("code",null,"EmojiPluginOptions | false")])],-1),ee=e("li",null,[e("p",null,"Details:"),e("p",null,[l("Options for "),e("a",{href:"https://github.com/markdown-it/markdown-it-emoji",target:"_blank",rel:"noopener noreferrer"},"markdown-it-emoji"),l(".")]),e("p",null,[l("Set to "),e("code",null,"false"),l(" to disable this plugin.")])],-1),le=e("p",null,"Also see:",-1),ne=e("h3",{id:"markdown-frontmatter",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#markdown-frontmatter"},[e("span",null,"markdown.frontmatter")])],-1),te=e("li",null,[e("p",null,[l("Type: "),e("code",null,"FrontmatterPluginOptions | false")])],-1),ie=e("li",null,[e("p",null,"Details:"),e("p",null,[l("Options for "),e("a",{href:"https://github.com/mdit-vue/mdit-vue/tree/main/packages/plugin-frontmatter",target:"_blank",rel:"noopener noreferrer"},"@mdit-vue/plugin-frontmatter"),l(".")]),e("p",null,[l("Set to "),e("code",null,"false"),l(" to disable this plugin.")])],-1),oe=e("p",null,"Also see:",-1),ae=o(`
Caution
You should not configure it unless you understand what it is for.
`,4),se=e("li",null,[e("p",null,"Details:"),e("p",null,[l("Options for "),e("a",{href:"https://github.com/mdit-vue/mdit-vue/tree/main/packages/plugin-headers",target:"_blank",rel:"noopener noreferrer"},"@mdit-vue/plugin-headers"),l(".")]),e("p",null,[l("Set to "),e("code",null,"false"),l(" to disable this plugin.")])],-1),re=e("p",null,"Also see:",-1),de=e("h3",{id:"markdown-importcode",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#markdown-importcode"},[e("span",null,"markdown.importCode")])],-1),pe=e("li",null,[e("p",null,[l("Type: "),e("code",null,"ImportCodePluginOptions | false")])],-1),ce=e("li",null,[e("p",null,"Details:"),e("p",null,"Options for VuePress built-in markdown-it import-code plugin."),e("p",null,[l("Set to "),e("code",null,"false"),l(" to disable this plugin.")])],-1),ue=e("p",null,"Also see:",-1),he=o('
',3),ve=e("li",null,[e("p",null,[l("Type: "),e("code",null,"SfcPluginOptions | false")])],-1),we=e("li",null,[e("p",null,"Details:"),e("p",null,[l("Options for "),e("a",{href:"https://github.com/mdit-vue/mdit-vue/tree/main/packages/plugin-sfc",target:"_blank",rel:"noopener noreferrer"},"@mdit-vue/plugin-sfc"),l(".")]),e("p",null,[l("Set to "),e("code",null,"false"),l(" to disable this plugin.")])],-1),Ce=e("p",null,"Also see:",-1),xe=o(`
Caution
You should not configure it unless you understand what it is for.
`,9),Te=e("li",null,[e("p",null,"Details:"),e("p",null,[l("Options for "),e("a",{href:"https://github.com/mdit-vue/mdit-vue/tree/main/packages/plugin-toc",target:"_blank",rel:"noopener noreferrer"},"@mdit-vue/plugin-toc"),l(".")]),e("p",null,[l("Set to "),e("code",null,"false"),l(" to disable this plugin.")])],-1),Ee=e("p",null,"Also see:",-1),Pe=e("h4",{id:"markdown-vpre-block",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#markdown-vpre-block"},[e("span",null,"markdown.vPre.block")])],-1),Ae=o("
Type: boolean
Default: true
Details:
Add v-pre directive to <pre> tag of code block or not.
Add v-pre directive to <code> tag of inline code or not.
",3),Oe=e("p",null,"Also see:",-1),Le=e("h2",{id:"plugin-config",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#plugin-config"},[e("span",null,"Plugin Config")])],-1),Me=e("h3",{id:"plugins",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#plugins"},[e("span",null,"plugins")])],-1),Ie=e("li",null,[e("p",null,[l("Type: "),e("code",null,"(Plugin | Plugin[])[]")])],-1),Re=e("li",null,[e("p",null,"Details:"),e("p",null,"Plugins to use."),e("p",null,"This option accepts an array, each item of which could be a plugin or an array of plugins.")],-1),Ge=e("p",null,"Also see:",-1),je=e("h2",{id:"plugin-api",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#plugin-api"},[e("span",null,"Plugin API")])],-1),Ve=e("p",null,[l("User config file also works as a VuePress plugin, so all of the Plugin APIs are available except the "),e("code",null,"name"),l(" and "),e("code",null,"multiple"),l(" options.")],-1);function qe(He,Ne){const n=s("RouteLink");return r(),d("div",null,[c,e("ul",null,[u,e("li",null,[h,e("ul",null,[e("li",null,[t(n,{to:"/guide/assets.html#base-helper"},{default:i(()=>[l("Guide > Assets > Base Helper")]),_:1})]),e("li",null,[t(n,{to:"/guide/deployment.html"},{default:i(()=>[l("Guide > Deployment")]),_:1})])])])]),f,e("ul",null,[m,e("li",null,[g,e("ul",null,[k,e("li",null,[t(n,{to:"/reference/frontmatter.html#lang"},{default:i(()=>[l("Frontmatter > lang")]),_:1})])])])]),b,e("ul",null,[y,e("li",null,[_,e("ul",null,[D,e("li",null,[t(n,{to:"/reference/frontmatter.html#description"},{default:i(()=>[l("Frontmatter > description")]),_:1})])])])]),v,e("ul",null,[e("li",null,[l("Also see: "),e("ul",null,[w,e("li",null,[t(n,{to:"/reference/frontmatter.html#head"},{default:i(()=>[l("Frontmatter > head")]),_:1})])])])]),C,e("ul",null,[x,e("li",null,[T,e("ul",null,[e("li",null,[t(n,{to:"/guide/i18n.html"},{default:i(()=>[l("Guide > I18n")]),_:1})])])])]),E,P,e("ul",null,[A,S,e("li",null,[B,e("ul",null,[e("li",null,[t(n,{to:"/guide/theme.html"},{default:i(()=>[l("Guide > Theme")]),_:1})]),F])])]),O,L,e("ul",null,[M,e("li",null,[I,e("ul",null,[e("li",null,[t(n,{to:"/guide/bundler.html"},{default:i(()=>[l("Guide > Bundler")]),_:1})]),e("li",null,[t(n,{to:"/reference/bundler/vite.html"},{default:i(()=>[l("Bundlers > Vite")]),_:1})]),e("li",null,[t(n,{to:"/reference/bundler/webpack.html"},{default:i(()=>[l("Bundlers > Webpack")]),_:1})])])])]),R,e("ul",null,[G,j,V,e("li",null,[q,e("ul",null,[e("li",null,[t(n,{to:"/guide/assets.html#public-files"},{default:i(()=>[l("Guide > Assets > Public Files")]),_:1})])])])]),H,e("ul",null,[N,e("li",null,[U,e("ul",null,[e("li",null,[t(n,{to:"/reference/frontmatter.html#permalinkpattern"},{default:i(()=>[l("Frontmatter > permalinkPattern")]),_:1})])])])]),Y,e("ul",null,[W,e("li",null,[$,e("ul",null,[z,e("li",null,[t(n,{to:"/guide/markdown.html#syntax-extensions"},{default:i(()=>[l("Guide > Markdown > Syntax Extensions")]),_:1})])])])]),Z,e("ul",null,[J,e("li",null,[K,e("ul",null,[e("li",null,[t(n,{to:"/guide/markdown.html#header-anchors"},{default:i(()=>[l("Guide > Markdown > Syntax Extensions > Header Anchors")]),_:1})])])])]),Q,e("ul",null,[X,ee,e("li",null,[le,e("ul",null,[e("li",null,[t(n,{to:"/guide/markdown.html#emoji"},{default:i(()=>[l("Guide > Markdown > Syntax Extensions > Emoji")]),_:1})])])])]),ne,e("ul",null,[te,ie,e("li",null,[oe,e("ul",null,[e("li",null,[t(n,{to:"/guide/page.html#frontmatter"},{default:i(()=>[l("Guide > Page > Frontmatter")]),_:1})]),e("li",null,[t(n,{to:"/reference/node-api.html#frontmatter"},{default:i(()=>[l("Node API > Page Properties > frontmatter")]),_:1})])])])]),ae,e("ul",null,[se,e("li",null,[re,e("ul",null,[e("li",null,[t(n,{to:"/reference/node-api.html#headers"},{default:i(()=>[l("Node API > Page Properties > headers")]),_:1})])])])]),de,e("ul",null,[pe,ce,e("li",null,[ue,e("ul",null,[e("li",null,[t(n,{to:"/guide/markdown.html#import-code-blocks"},{default:i(()=>[l("Guide > Markdown > Syntax Extensions > Import Code Blocks")]),_:1})])])])]),he,e("ul",null,[fe,e("li",null,[me,e("ul",null,[e("li",null,[t(n,{to:"/guide/markdown.html#links"},{default:i(()=>[l("Guide > Markdown > Syntax Extensions > Links")]),_:1})])])])]),ge,e("ul",null,[ke,be,e("li",null,[ye,_e,e("p",null,[l("By default, this plugin will transform internal links to "),t(n,{to:"/reference/components.html#routelink"},{default:i(()=>[l("RouteLink")]),_:1}),l(".")])])]),De,e("ul",null,[ve,we,e("li",null,[Ce,e("ul",null,[e("li",null,[t(n,{to:"/advanced/cookbook/markdown-and-vue-sfc.html"},{default:i(()=>[l("Cookbook > Markdown and Vue SFC")]),_:1})]),e("li",null,[t(n,{to:"/reference/node-api.html#sfcblocks"},{default:i(()=>[l("Node API > Page Properties > sfcBlocks")]),_:1})])])])]),xe,e("ul",null,[Te,e("li",null,[Ee,e("ul",null,[e("li",null,[t(n,{to:"/guide/markdown.html#table-of-contents"},{default:i(()=>[l("Guide > Markdown > Syntax Extensions > Table of Contents")]),_:1})])])])]),Pe,e("ul",null,[Ae,e("li",null,[Se,e("ul",null,[e("li",null,[t(n,{to:"/guide/markdown.html#wrap-with-v-pre"},{default:i(()=>[l("Guide > Markdown > Syntax Extensions > Code Blocks > Wrap with v-pre")]),_:1})])])])]),Be,e("ul",null,[Fe,e("li",null,[Oe,e("ul",null,[e("li",null,[t(n,{to:"/guide/markdown.html#wrap-with-v-pre"},{default:i(()=>[l("Guide > Markdown > Syntax Extensions > Code Blocks > Wrap with v-pre")]),_:1})])])])]),Le,Me,e("ul",null,[Ie,Re,e("li",null,[Ge,e("ul",null,[e("li",null,[t(n,{to:"/guide/plugin.html"},{default:i(()=>[l("Guide > Plugin")]),_:1})])])])]),je,Ve,e("p",null,[l("Please check out "),t(n,{to:"/reference/plugin-api.html"},{default:i(()=>[l("Plugin API Reference")]),_:1}),l(" for a full list of Plugin APIs.")])])}const Ye=a(p,[["render",qe],["__file","config.html.vue"]]),We=JSON.parse('{"path":"/reference/config.html","title":"Config","lang":"en-US","frontmatter":{"description":"Config Site Config base Type: string Default: / Details: The base URL the site will be deployed at. You will need to set this if you plan to deploy your site under a sub path. I...","head":[["link",{"rel":"alternate","hreflang":"zh-cn","href":"https://v2.vuepress.vuejs.org/zh/reference/config.html"}],["meta",{"property":"og:url","content":"https://v2.vuepress.vuejs.org/reference/config.html"}],["meta",{"property":"og:site_name","content":"VuePress"}],["meta",{"property":"og:title","content":"Config"}],["meta",{"property":"og:description","content":"Config Site Config base Type: string Default: / Details: The base URL the site will be deployed at. You will need to set this if you plan to deploy your site under a sub path. I..."}],["meta",{"property":"og:type","content":"article"}],["meta",{"property":"og:locale","content":"en-US"}],["meta",{"property":"og:locale:alternate","content":"zh-CN"}],["meta",{"property":"og:updated_time","content":"2024-07-14T14:29:58.000Z"}],["meta",{"property":"article:modified_time","content":"2024-07-14T14:29:58.000Z"}],["script",{"type":"application/ld+json"},"{\\"@context\\":\\"https://schema.org\\",\\"@type\\":\\"Article\\",\\"headline\\":\\"Config\\",\\"image\\":[\\"\\"],\\"dateModified\\":\\"2024-07-14T14:29:58.000Z\\",\\"author\\":[]}"]]},"headers":[{"level":2,"title":"Site Config","slug":"site-config","link":"#site-config","children":[{"level":3,"title":"base","slug":"base","link":"#base","children":[]},{"level":3,"title":"lang","slug":"lang","link":"#lang","children":[]},{"level":3,"title":"title","slug":"title","link":"#title","children":[]},{"level":3,"title":"description","slug":"description","link":"#description","children":[]},{"level":3,"title":"head","slug":"head","link":"#head","children":[]},{"level":3,"title":"locales","slug":"locales","link":"#locales","children":[]}]},{"level":2,"title":"Theme Config","slug":"theme-config","link":"#theme-config","children":[{"level":3,"title":"theme","slug":"theme","link":"#theme","children":[]}]},{"level":2,"title":"Bundler Config","slug":"bundler-config","link":"#bundler-config","children":[{"level":3,"title":"bundler","slug":"bundler","link":"#bundler","children":[]}]},{"level":2,"title":"Common Config","slug":"common-config","link":"#common-config","children":[{"level":3,"title":"dest","slug":"dest","link":"#dest","children":[]},{"level":3,"title":"temp","slug":"temp","link":"#temp","children":[]},{"level":3,"title":"cache","slug":"cache","link":"#cache","children":[]},{"level":3,"title":"public","slug":"public","link":"#public","children":[]},{"level":3,"title":"debug","slug":"debug","link":"#debug","children":[]},{"level":3,"title":"pagePatterns","slug":"pagepatterns","link":"#pagepatterns","children":[]},{"level":3,"title":"permalinkPattern","slug":"permalinkpattern","link":"#permalinkpattern","children":[]}]},{"level":2,"title":"Dev Config","slug":"dev-config","link":"#dev-config","children":[{"level":3,"title":"host","slug":"host","link":"#host","children":[]},{"level":3,"title":"port","slug":"port","link":"#port","children":[]},{"level":3,"title":"open","slug":"open","link":"#open","children":[]},{"level":3,"title":"templateDev","slug":"templatedev","link":"#templatedev","children":[]}]},{"level":2,"title":"Build Config","slug":"build-config","link":"#build-config","children":[{"level":3,"title":"shouldPreload","slug":"shouldpreload","link":"#shouldpreload","children":[]},{"level":3,"title":"shouldPrefetch","slug":"shouldprefetch","link":"#shouldprefetch","children":[]},{"level":3,"title":"templateBuild","slug":"templatebuild","link":"#templatebuild","children":[]},{"level":3,"title":"templateBuildRenderer","slug":"templatebuildrenderer","link":"#templatebuildrenderer","children":[]}]},{"level":2,"title":"Markdown Config","slug":"markdown-config","link":"#markdown-config","children":[{"level":3,"title":"markdown","slug":"markdown","link":"#markdown","children":[]},{"level":3,"title":"markdown.anchor","slug":"markdown-anchor","link":"#markdown-anchor","children":[]},{"level":3,"title":"markdown.assets","slug":"markdown-assets","link":"#markdown-assets","children":[]},{"level":3,"title":"markdown.component","slug":"markdown-component","link":"#markdown-component","children":[]},{"level":3,"title":"markdown.emoji","slug":"markdown-emoji","link":"#markdown-emoji","children":[]},{"level":3,"title":"markdown.frontmatter","slug":"markdown-frontmatter","link":"#markdown-frontmatter","children":[]},{"level":3,"title":"markdown.headers","slug":"markdown-headers","link":"#markdown-headers","children":[]},{"level":3,"title":"markdown.importCode","slug":"markdown-importcode","link":"#markdown-importcode","children":[]},{"level":3,"title":"markdown.links","slug":"markdown-links","link":"#markdown-links","children":[]},{"level":3,"title":"markdown.sfc","slug":"markdown-sfc","link":"#markdown-sfc","children":[]},{"level":3,"title":"markdown.slugify","slug":"markdown-slugify","link":"#markdown-slugify","children":[]},{"level":3,"title":"markdown.title","slug":"markdown-title","link":"#markdown-title","children":[]},{"level":3,"title":"markdown.toc","slug":"markdown-toc","link":"#markdown-toc","children":[]}]},{"level":2,"title":"Plugin Config","slug":"plugin-config","link":"#plugin-config","children":[{"level":3,"title":"plugins","slug":"plugins","link":"#plugins","children":[]}]},{"level":2,"title":"Plugin API","slug":"plugin-api","link":"#plugin-api","children":[]}],"git":{"updatedTime":1720967398000,"contributors":[{"name":"meteorlxy","email":"meteor.lxy@foxmail.com","commits":5},{"name":"Mr.Hope","email":"mister-hope@outlook.com","commits":2},{"name":"lebennington","email":"100212066+lebennington@users.noreply.github.com","commits":1}]},"autoDesc":true,"filePathRelative":"reference/config.md"}');export{Ye as comp,We as data};
diff --git a/assets/config.html-rHmtn1_Z.js b/assets/config.html-rHmtn1_Z.js
new file mode 100644
index 000000000..13f9653f3
--- /dev/null
+++ b/assets/config.html-rHmtn1_Z.js
@@ -0,0 +1,15 @@
+import{_ as o,r as i,o as r,c as d,a as e,d as a,w as t,b as l,e as s}from"./app-CqHoxGIc.js";const p={},c=s('
',9),V=e("li",null,[e("p",null,[l("类型: "),e("code",null,"string")])],-1),j=e("li",null,[e("p",null,[l("默认值: "),e("code",null,"`${sourceDir}/.vuepress/public`")])],-1),L=e("li",null,[e("p",null,"详情:"),e("p",null,"指定 Public 文件目录。")],-1),O=e("p",null,"参考:",-1),q=s('
',3),S=e("p",null,"参考:",-1),$=e("li",null,[e("a",{href:"https://github.com/markdown-it/markdown-it#init-with-presets-and-options",target:"_blank",rel:"noopener noreferrer"},"markdown-it > Init with presets and options")],-1),U=s(`
The essential file for configuring a VuePress site is .vuepress/config.js, while TypeScript config file is also supported. You can use .vuepress/config.ts instead to get better types hint for VuePress config.
To be more specific, we have a convention for config file paths (in order of precedence):
In most cases, the config file is sufficient to configure your VuePress site. However, sometimes users may want to add some client-side code directly. To help with this, VuePress also supports a client config file:
`,7),m={class:"hint-container tip"},h=s("p",{class:"hint-container-title"},"Tips",-1),C=s("p",null,"Unlike config file, client config file could not be specified via CLI options.",-1);function y(b,E){const n=t("RouteLink");return c(),r("div",null,[d,s("p",null,[e("You can also specify the config file via "),u,e(" option of "),l(n,{to:"/reference/cli.html"},{default:i(()=>[e("CLI")]),_:1}),e(":")]),f,s("div",g,[v,s("p",null,[e("Check out the "),l(n,{to:"/reference/config.html"},{default:i(()=>[e("Config Reference")]),_:1}),e(" for a full list of VuePress config.")])]),D,s("div",m,[h,C,s("p",null,[e("To learn more about client config file, see "),l(n,{to:"/advanced/cookbook/usage-of-client-config.html"},{default:i(()=>[e("Advanced > Cookbook > Usage of Client Config")]),_:1})])])])}const k=a(p,[["render",y],["__file","configuration.html.vue"]]),A=JSON.parse('{"path":"/guide/configuration.html","title":"Configuration","lang":"en-US","frontmatter":{"description":"Configuration Config File The essential file for configuring a VuePress site is .vuepress/config.js, while TypeScript config file is also supported. You can use .vuepress/config...","head":[["link",{"rel":"alternate","hreflang":"zh-cn","href":"https://v2.vuepress.vuejs.org/zh/guide/configuration.html"}],["meta",{"property":"og:url","content":"https://v2.vuepress.vuejs.org/guide/configuration.html"}],["meta",{"property":"og:site_name","content":"VuePress"}],["meta",{"property":"og:title","content":"Configuration"}],["meta",{"property":"og:description","content":"Configuration Config File The essential file for configuring a VuePress site is .vuepress/config.js, while TypeScript config file is also supported. You can use .vuepress/config..."}],["meta",{"property":"og:type","content":"article"}],["meta",{"property":"og:locale","content":"en-US"}],["meta",{"property":"og:locale:alternate","content":"zh-CN"}],["meta",{"property":"og:updated_time","content":"2024-01-26T16:29:43.000Z"}],["meta",{"property":"article:modified_time","content":"2024-01-26T16:29:43.000Z"}],["script",{"type":"application/ld+json"},"{\\"@context\\":\\"https://schema.org\\",\\"@type\\":\\"Article\\",\\"headline\\":\\"Configuration\\",\\"image\\":[\\"\\"],\\"dateModified\\":\\"2024-01-26T16:29:43.000Z\\",\\"author\\":[]}"]]},"headers":[{"level":2,"title":"Config File","slug":"config-file","link":"#config-file","children":[]},{"level":2,"title":"Client Config File","slug":"client-config-file","link":"#client-config-file","children":[]}],"git":{"updatedTime":1706286583000,"contributors":[{"name":"meteorlxy","email":"meteor.lxy@foxmail.com","commits":4}]},"autoDesc":true,"filePathRelative":"guide/configuration.md"}');export{k as comp,A as data};
diff --git a/assets/configuration.html-DNFceaxK.js b/assets/configuration.html-DNFceaxK.js
new file mode 100644
index 000000000..b3523a101
--- /dev/null
+++ b/assets/configuration.html-DNFceaxK.js
@@ -0,0 +1,24 @@
+import{_ as i,r as t,o as p,c,a as e,b as s,d as l,w as a,e as o}from"./app-CqHoxGIc.js";const r={},d=o('
If you are deploying to https://<USERNAME>.github.io/, you can omit this step as base defaults to "/".
If you are deploying to https://<USERNAME>.github.io/<REPO>/, for example your repository is at https://github.com/<USERNAME>/<REPO>, then set base to "/<REPO>/".
",2),D=s("li",null,[s("p",null,[e("Choose your preferred CI tools. Here we take "),s("a",{href:"https://github.com/features/actions",target:"_blank",rel:"noopener noreferrer"},"GitHub Actions"),e(" as an example.")]),s("p",null,[e("Create "),s("code",null,".github/workflows/docs.yml"),e(" to set up the workflow.")])],-1),y=n(`Click to expand sample config
name: docs
+
+on:
+ # trigger deployment on every push to main branch
+ push:
+ branches: [main]
+ # trigger deployment manually
+ workflow_dispatch:
+
+jobs:
+ docs:
+ runs-on: ubuntu-latest
+
+ steps:
+ - uses: actions/checkout@v4
+ with:
+ # fetch all commits to get last updated time or other git log info
+ fetch-depth: 0
+
+ - name: Setup pnpm
+ uses: pnpm/action-setup@v2
+ with:
+ # choose pnpm version to use
+ version: 8
+ # install deps with pnpm
+ run_install: true
+
+ - name: Setup Node.js
+ uses: actions/setup-node@v4
+ with:
+ # choose node.js version to use
+ node-version: 20
+ # cache deps for pnpm
+ cache: pnpm
+
+ # run build script
+ - name: Build VuePress site
+ run: pnpm docs:build
+
+ # please check out the docs of the workflow for more details
+ # @see https://github.com/crazy-max/ghaction-github-pages
+ - name: Deploy to GitHub Pages
+ uses: crazy-max/ghaction-github-pages@v4
+ with:
+ # deploy to gh-pages branch
+ target_branch: gh-pages
+ # deploy the default output dir of VuePress
+ build_dir: docs/.vuepress/dist
+ env:
+ # @see https://docs.github.com/en/actions/reference/authentication-in-a-workflow#about-the-github_token-secret
+ GITHUB_TOKEN: \${{ secrets.GITHUB_TOKEN }}
If you are deploying to https://<USERNAME>.gitlab.io/, you can omit base as it defaults to "/".
If you are deploying to https://<USERNAME>.gitlab.io/<REPO>/, for example your repository is at https://gitlab.com/<USERNAME>/<REPO>, then set base to "/<REPO>/".
",2),v=s("li",null,[s("p",null,[e("Create "),s("code",null,".gitlab-ci.yml"),e(" to set up "),s("a",{href:"https://about.gitlab.com/stages-devops-lifecycle/continuous-integration/",target:"_blank",rel:"noopener noreferrer"},"GitLab CI"),e(" workflow.")])],-1),h=n(`Click to expand sample config
# choose a docker image to use
+image: node:18-buster
+
+pages:
+ # trigger deployment on every push to main branch
+ only:
+ - main
+
+ # cache node_modules
+ cache:
+ key:
+ files:
+ - pnpm-lock.yaml
+ paths:
+ - .pnpm-store
+
+ # Install pnpm
+ before_script:
+ - curl -fsSL https://get.pnpm.io/install.sh | sh -
+ - pnpm config set store-dir .pnpm-store
+
+ # install dependencies and run build script
+ script:
+ - pnpm i --frozen-lockfile
+ - pnpm docs:build --dest public
+
+ artifacts:
+ paths:
+ - public
Go to Vercel, set up a new project from GitHub with the following settings:
FRAMEWORK PRESET:Other
BUILD COMMAND:pnpm docs:build
OUTPUT DIRECTORY:docs/.vuepress/dist
Hit the deploy button.
`,25);function b(g,f){const a=t("RouteLink");return p(),r("div",null,[d,s("ol",null,[s("li",null,[s("p",null,[e("Set the correct "),l(a,{to:"/reference/config.html#base"},{default:o(()=>[e("base")]),_:1}),e(" config.")]),u]),D]),y,s("ol",null,[s("li",null,[s("p",null,[e("Set the correct "),l(a,{to:"/reference/config.html#base"},{default:o(()=>[e("base")]),_:1}),e(" config.")]),m]),v]),h])}const k=i(c,[["render",b],["__file","deployment.html.vue"]]),E=JSON.parse('{"path":"/guide/deployment.html","title":"Deployment","lang":"en-US","frontmatter":{"description":"Deployment The following guides are based on some shared assumptions: You are placing your Markdown source files inside the docs directory of your project; You are using the def...","head":[["link",{"rel":"alternate","hreflang":"zh-cn","href":"https://v2.vuepress.vuejs.org/zh/guide/deployment.html"}],["meta",{"property":"og:url","content":"https://v2.vuepress.vuejs.org/guide/deployment.html"}],["meta",{"property":"og:site_name","content":"VuePress"}],["meta",{"property":"og:title","content":"Deployment"}],["meta",{"property":"og:description","content":"Deployment The following guides are based on some shared assumptions: You are placing your Markdown source files inside the docs directory of your project; You are using the def..."}],["meta",{"property":"og:type","content":"article"}],["meta",{"property":"og:locale","content":"en-US"}],["meta",{"property":"og:locale:alternate","content":"zh-CN"}],["meta",{"property":"og:updated_time","content":"2024-01-26T13:03:35.000Z"}],["meta",{"property":"article:modified_time","content":"2024-01-26T13:03:35.000Z"}],["script",{"type":"application/ld+json"},"{\\"@context\\":\\"https://schema.org\\",\\"@type\\":\\"Article\\",\\"headline\\":\\"Deployment\\",\\"image\\":[\\"\\"],\\"dateModified\\":\\"2024-01-26T13:03:35.000Z\\",\\"author\\":[]}"]]},"headers":[{"level":2,"title":"GitHub Pages","slug":"github-pages","link":"#github-pages","children":[]},{"level":2,"title":"GitLab Pages","slug":"gitlab-pages","link":"#gitlab-pages","children":[]},{"level":2,"title":"Google Firebase","slug":"google-firebase","link":"#google-firebase","children":[]},{"level":2,"title":"Heroku","slug":"heroku","link":"#heroku","children":[]},{"level":2,"title":"Kinsta","slug":"kinsta","link":"#kinsta","children":[]},{"level":2,"title":"Edgio","slug":"edgio","link":"#edgio","children":[]},{"level":2,"title":"Netlify","slug":"netlify","link":"#netlify","children":[]},{"level":2,"title":"Vercel","slug":"vercel","link":"#vercel","children":[]}],"git":{"updatedTime":1706274215000,"contributors":[{"name":"Mr.Hope","email":"mister-hope@outlook.com","commits":2},{"name":"meteorlxy","email":"meteor.lxy@foxmail.com","commits":1}]},"autoDesc":true,"filePathRelative":"guide/deployment.md"}');export{k as comp,E as data};
diff --git a/assets/frontmatter.html-BCqH_rDa.js b/assets/frontmatter.html-BCqH_rDa.js
new file mode 100644
index 000000000..5e8557dff
--- /dev/null
+++ b/assets/frontmatter.html-BCqH_rDa.js
@@ -0,0 +1,24 @@
+import{_ as o,r as i,o as r,c as p,a as e,d as n,w as a,b as l,e as s}from"./app-CqHoxGIc.js";const d={},c=e("h1",{id:"frontmatter",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#frontmatter"},[e("span",null,"Frontmatter")])],-1),u=e("h2",{id:"date",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#date"},[e("span",null,"date")])],-1),h=e("li",null,[e("p",null,[l("Type: "),e("code",null,"string")])],-1),m=e("li",null,[e("p",null,"Details:"),e("p",null,"Created date for the page."),e("p",null,[l("You should specify the date in the form of "),e("code",null,"yyyy-MM-dd"),l(", or follow the "),e("a",{href:"https://yaml.org/type/timestamp.html",target:"_blank",rel:"noopener noreferrer"},"YAML Timestamp Type"),l(".")])],-1),y=e("p",null,"Also see:",-1),D=e("h2",{id:"description",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#description"},[e("span",null,"description")])],-1),f=e("li",null,[e("p",null,[l("Type: "),e("code",null,"string")])],-1),g=e("li",null,[e("p",null,"Details:"),e("p",null,"Description for the page."),e("p",null,[l("This will override the "),e("code",null,"description"),l(" option in your site config.")])],-1),v=e("p",null,"Also see:",-1),b=s(`
`,5),_=e("h2",{id:"lang",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#lang"},[e("span",null,"lang")])],-1),C=e("li",null,[e("p",null,[l("Type: "),e("code",null,"string")])],-1),k=e("li",null,[e("p",null,"Details:"),e("p",null,"Language for the page."),e("p",null,[l("This will override the "),e("code",null,"lang"),l(" option in your site config.")])],-1),E=e("p",null,"Also see:",-1),T=s(`
Layouts are provided by theme. If you don't specify this frontmatter, the default layout will be used. You should refer to the theme's own documentation to find what layouts it provides.
If the theme layouts cannot meet your needs, you can use a custom layout component.
Example:
Register a layout component in .vuepress/client.ts file:
`,7),x=e("li",null,[e("p",null,[l("Type: "),e("code",null,"string | null")])],-1),P=e("li",null,[e("p",null,"Details:"),e("p",null,"Permalink for the page."),e("p",null,"This will override the default route path that determined by the file path of the page."),e("p",null,[l("When it is set to "),e("code",null,"null"),l(", the permalink of the page will be disabled.")])],-1),M=e("p",null,"Also see:",-1),A=e("li",null,[e("a",{href:"#permalinkpattern"},"Frontmatter > permalinkPattern")],-1),w=s(`
Then the permalink of the page would be 2021/01/03/bar-baz.html.
`,7),F=e("li",null,[e("a",{href:"#date"},"Frontmatter > date")],-1),L=e("li",null,[e("a",{href:"#permalink"},"Frontmatter > permalink")],-1),N=e("h2",{id:"routemeta",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#routemeta"},[e("span",null,"routeMeta")])],-1),q=e("li",null,[e("p",null,[l("Type: "),e("code",null,"Record")])],-1),I=e("li",null,[e("p",null,"Details:"),e("p",null,"Custom data to be attached to the page route.")],-1),R=e("p",null,"Also see:",-1),Y=e("h2",{id:"title",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#title"},[e("span",null,"title")])],-1),S=e("li",null,[e("p",null,[l("Type: "),e("code",null,"string")])],-1),z=e("li",null,[e("p",null,"Details:"),e("p",null,"Title for the page."),e("p",null,[l("If you don't specify "),e("code",null,"title"),l(" in frontmatter, content of the first level-one header (i.e. "),e("code",null,"# title"),l(") will be used as the title.")])],-1),V=e("p",null,"Also see:",-1);function j(B,U){const t=i("RouteLink");return r(),p("div",null,[c,u,e("ul",null,[h,m,e("li",null,[y,e("ul",null,[e("li",null,[n(t,{to:"/reference/node-api.html#date"},{default:a(()=>[l("Node API > Page Properties > date")]),_:1})])])])]),D,e("ul",null,[f,g,e("li",null,[v,e("ul",null,[e("li",null,[n(t,{to:"/reference/config.html#description"},{default:a(()=>[l("Config > description")]),_:1})])])])]),b,e("ul",null,[e("li",null,[l("Also see: "),e("ul",null,[e("li",null,[n(t,{to:"/reference/config.html#head"},{default:a(()=>[l("Config > head")]),_:1})])])])]),_,e("ul",null,[C,k,e("li",null,[E,e("ul",null,[e("li",null,[n(t,{to:"/reference/config.html#lang"},{default:a(()=>[l("Config > lang")]),_:1})]),e("li",null,[n(t,{to:"/reference/node-api.html#lang"},{default:a(()=>[l("Node API > Page Properties > lang")]),_:1})])])])]),T,e("ul",null,[x,P,e("li",null,[M,e("ul",null,[A,e("li",null,[n(t,{to:"/guide/page.html#routing"},{default:a(()=>[l("Guide > Page > Routing")]),_:1})]),e("li",null,[n(t,{to:"/reference/node-api.html#permalink"},{default:a(()=>[l("Node API > Page Properties > permalink")]),_:1})])])])]),w,e("ul",null,[e("li",null,[l("Also see: "),e("ul",null,[e("li",null,[n(t,{to:"/reference/config.html#permalinkpattern"},{default:a(()=>[l("Config > permalinkPattern")]),_:1})]),F,L,e("li",null,[n(t,{to:"/reference/node-api.html#permalink"},{default:a(()=>[l("Node API > Page Properties > permalink")]),_:1})])])])]),N,e("ul",null,[q,I,e("li",null,[R,e("ul",null,[e("li",null,[n(t,{to:"/reference/node-api.html#routeMeta"},{default:a(()=>[l("Node API > Page Properties > routeMeta")]),_:1})])])])]),Y,e("ul",null,[S,z,e("li",null,[V,e("ul",null,[e("li",null,[n(t,{to:"/reference/node-api.html#title"},{default:a(()=>[l("Node API > Page Properties > title")]),_:1})])])])])])}const H=o(d,[["render",j],["__file","frontmatter.html.vue"]]),G=JSON.parse('{"path":"/reference/frontmatter.html","title":"Frontmatter","lang":"en-US","frontmatter":{"description":"Frontmatter date Type: string Details: Created date for the page. You should specify the date in the form of yyyy-MM-dd, or follow the YAML Timestamp Type. Also see: description...","head":[["link",{"rel":"alternate","hreflang":"zh-cn","href":"https://v2.vuepress.vuejs.org/zh/reference/frontmatter.html"}],["meta",{"property":"og:url","content":"https://v2.vuepress.vuejs.org/reference/frontmatter.html"}],["meta",{"property":"og:site_name","content":"VuePress"}],["meta",{"property":"og:title","content":"Frontmatter"}],["meta",{"property":"og:description","content":"Frontmatter date Type: string Details: Created date for the page. You should specify the date in the form of yyyy-MM-dd, or follow the YAML Timestamp Type. Also see: description..."}],["meta",{"property":"og:type","content":"article"}],["meta",{"property":"og:locale","content":"en-US"}],["meta",{"property":"og:locale:alternate","content":"zh-CN"}],["meta",{"property":"og:updated_time","content":"2024-05-16T12:45:44.000Z"}],["meta",{"property":"article:modified_time","content":"2024-05-16T12:45:44.000Z"}],["script",{"type":"application/ld+json"},"{\\"@context\\":\\"https://schema.org\\",\\"@type\\":\\"Article\\",\\"headline\\":\\"Frontmatter\\",\\"image\\":[\\"\\"],\\"dateModified\\":\\"2024-05-16T12:45:44.000Z\\",\\"author\\":[]}"]]},"headers":[{"level":2,"title":"date","slug":"date","link":"#date","children":[]},{"level":2,"title":"description","slug":"description","link":"#description","children":[]},{"level":2,"title":"head","slug":"head","link":"#head","children":[]},{"level":2,"title":"lang","slug":"lang","link":"#lang","children":[]},{"level":2,"title":"layout","slug":"layout","link":"#layout","children":[]},{"level":2,"title":"permalink","slug":"permalink","link":"#permalink","children":[]},{"level":2,"title":"permalinkPattern","slug":"permalinkpattern","link":"#permalinkpattern","children":[]},{"level":2,"title":"routeMeta","slug":"routemeta","link":"#routemeta","children":[]},{"level":2,"title":"title","slug":"title","link":"#title","children":[]}],"git":{"updatedTime":1715863544000,"contributors":[{"name":"meteorlxy","email":"meteor.lxy@foxmail.com","commits":5},{"name":"Mr.Hope","email":"mister-hope@outlook.com","commits":1},{"name":"张怀文","email":"mister-hope@outlook.com","commits":1}]},"autoDesc":true,"filePathRelative":"reference/frontmatter.md"}');export{H as comp,G as data};
diff --git a/assets/frontmatter.html-BfmWvdQI.js b/assets/frontmatter.html-BfmWvdQI.js
new file mode 100644
index 000000000..bcf4457ae
--- /dev/null
+++ b/assets/frontmatter.html-BfmWvdQI.js
@@ -0,0 +1,24 @@
+import{_ as o,r,o as i,c as p,a as e,d as a,w as s,b as l,e as t}from"./app-CqHoxGIc.js";const d={},c=e("h1",{id:"frontmatter",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#frontmatter"},[e("span",null,"Frontmatter")])],-1),u=e("h2",{id:"date",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#date"},[e("span",null,"date")])],-1),m=e("li",null,[e("p",null,[l("类型: "),e("code",null,"string")])],-1),h=e("li",null,[e("p",null,"详情:"),e("p",null,"页面的创建日期。"),e("p",null,[l("应按照 "),e("code",null,"yyyy-MM-dd"),l(" 的格式来指定日期,或者遵循 "),e("a",{href:"https://yaml.org/type/timestamp.html",target:"_blank",rel:"noopener noreferrer"},"YAML Timestamp Type"),l(" 。")])],-1),y=e("p",null,"参考:",-1),D=e("h2",{id:"description",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#description"},[e("span",null,"description")])],-1),v=e("li",null,[e("p",null,[l("类型: "),e("code",null,"string")])],-1),g=e("li",null,[e("p",null,"详情:"),e("p",null,"页面的描述。"),e("p",null,[l("它将会覆盖站点配置中的 "),e("code",null,"description"),l(" 配置项。")])],-1),_=e("p",null,"参考:",-1),b=t(`
VuePress v2 is currently in RC (Release Candidate) stage. It's ready to be used for building your site, but the config and API are not stable enough, which is possibly to have minor breaking changes. So make sure to read the changelog carefully each time you upgrade a RC version.
The docs directory is where you put your markdown files, and it will be used as the source directory of VuePress.
The docs/.vuepress directory, i.e. the .vuepress directory in the source directory, is where all VuePress-specific files will be placed. Currently there is only one config file in it. By default, the temp, cache and output directory will also be generated inside this directory. It is suggested to add them to your .gitignore file.
Then, run docs:dev script to start the dev server:
`,17),x=e("div",{class:"language-bash line-numbers-mode","data-highlighter":"shiki","data-ext":"bash","data-title":"bash",style:{"background-color":"#1E1E1E",color:"#D4D4D4"}},[e("pre",{class:"shiki dark-plus vp-code"},[e("code",null,[e("span",{class:"line"},[e("span",{style:{color:"#DCDCAA"}},"pnpm"),e("span",{style:{color:"#CE9178"}}," docs:dev")])])]),e("div",{class:"line-numbers","aria-hidden":"true",style:{"counter-reset":"line-number 0"}},[e("div",{class:"line-number"})])],-1),w=e("div",{class:"language-bash line-numbers-mode","data-highlighter":"shiki","data-ext":"bash","data-title":"bash",style:{"background-color":"#1E1E1E",color:"#D4D4D4"}},[e("pre",{class:"shiki dark-plus vp-code"},[e("code",null,[e("span",{class:"line"},[e("span",{style:{color:"#DCDCAA"}},"yarn"),e("span",{style:{color:"#CE9178"}}," docs:dev")])])]),e("div",{class:"line-numbers","aria-hidden":"true",style:{"counter-reset":"line-number 0"}},[e("div",{class:"line-number"})])],-1),P=e("div",{class:"language-bash line-numbers-mode","data-highlighter":"shiki","data-ext":"bash","data-title":"bash",style:{"background-color":"#1E1E1E",color:"#D4D4D4"}},[e("pre",{class:"shiki dark-plus vp-code"},[e("code",null,[e("span",{class:"line"},[e("span",{style:{color:"#DCDCAA"}},"npm"),e("span",{style:{color:"#CE9178"}}," run"),e("span",{style:{color:"#CE9178"}}," docs:dev")])])]),e("div",{class:"line-numbers","aria-hidden":"true",style:{"counter-reset":"line-number 0"}},[e("div",{class:"line-number"})])],-1),S=e("p",null,[s("VuePress will start a hot-reloading development server at "),e("a",{href:"http://localhost:8080",target:"_blank",rel:"noopener noreferrer"},"http://localhost:8080"),s(". When you modify your markdown files, the content in the browser will be auto updated.")],-1),V=e("h3",{id:"build-your-site",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#build-your-site"},[e("span",null,"Build Your Site")])],-1),j=e("p",null,[s("To build your site, run "),e("code",null,"docs:build"),s(" script:")],-1),q=e("div",{class:"language-bash line-numbers-mode","data-highlighter":"shiki","data-ext":"bash","data-title":"bash",style:{"background-color":"#1E1E1E",color:"#D4D4D4"}},[e("pre",{class:"shiki dark-plus vp-code"},[e("code",null,[e("span",{class:"line"},[e("span",{style:{color:"#DCDCAA"}},"pnpm"),e("span",{style:{color:"#CE9178"}}," docs:build")])])]),e("div",{class:"line-numbers","aria-hidden":"true",style:{"counter-reset":"line-number 0"}},[e("div",{class:"line-number"})])],-1),I=e("div",{class:"language-bash line-numbers-mode","data-highlighter":"shiki","data-ext":"bash","data-title":"bash",style:{"background-color":"#1E1E1E",color:"#D4D4D4"}},[e("pre",{class:"shiki dark-plus vp-code"},[e("code",null,[e("span",{class:"line"},[e("span",{style:{color:"#DCDCAA"}},"yarn"),e("span",{style:{color:"#CE9178"}}," docs:build")])])]),e("div",{class:"line-numbers","aria-hidden":"true",style:{"counter-reset":"line-number 0"}},[e("div",{class:"line-number"})])],-1),T=e("div",{class:"language-bash line-numbers-mode","data-highlighter":"shiki","data-ext":"bash","data-title":"bash",style:{"background-color":"#1E1E1E",color:"#D4D4D4"}},[e("pre",{class:"shiki dark-plus vp-code"},[e("code",null,[e("span",{class:"line"},[e("span",{style:{color:"#DCDCAA"}},"npm"),e("span",{style:{color:"#CE9178"}}," run"),e("span",{style:{color:"#CE9178"}}," docs:build")])])]),e("div",{class:"line-numbers","aria-hidden":"true",style:{"counter-reset":"line-number 0"}},[e("div",{class:"line-number"})])],-1),G=e("code",null,"docs/.vuepress/dist",-1),R=e("h2",{id:"learn-more-about-vuepress",tabindex:"-1"},[e("a",{class:"header-anchor",href:"#learn-more-about-vuepress"},[e("span",null,"Learn More about VuePress")])],-1),B=e("p",null,"By now, you should have a basic but functional VuePress site. But you may still need to read the subsequent guide to learn more about VuePress.",-1);function N(F,L){const n=r("CodeGroupItem"),t=r("CodeGroup"),o=r("RouteLink");return d(),p("div",null,[h,a(t,null,{default:l(()=>[a(n,{title:"pnpm",active:""},{default:l(()=>[m]),_:1}),a(n,{title:"yarn"},{default:l(()=>[v]),_:1}),a(n,{title:"npm"},{default:l(()=>[b]),_:1})]),_:1}),y,a(t,null,{default:l(()=>[a(n,{title:"pnpm",active:""},{default:l(()=>[g]),_:1}),a(n,{title:"yarn"},{default:l(()=>[D]),_:1}),a(n,{title:"npm"},{default:l(()=>[C]),_:1})]),_:1}),k,a(t,null,{default:l(()=>[a(n,{title:"pnpm",active:""},{default:l(()=>[E]),_:1}),a(n,{title:"yarn"},{default:l(()=>[f]),_:1}),a(n,{title:"npm"},{default:l(()=>[_]),_:1})]),_:1}),A,a(t,null,{default:l(()=>[a(n,{title:"pnpm",active:""},{default:l(()=>[x]),_:1}),a(n,{title:"yarn"},{default:l(()=>[w]),_:1}),a(n,{title:"npm"},{default:l(()=>[P]),_:1})]),_:1}),S,V,j,a(t,null,{default:l(()=>[a(n,{title:"pnpm",active:""},{default:l(()=>[q]),_:1}),a(n,{title:"yarn"},{default:l(()=>[I]),_:1}),a(n,{title:"npm"},{default:l(()=>[T]),_:1})]),_:1}),e("p",null,[s("You will see the generated static files in the "),G,s(" directory. You can check out "),a(o,{to:"/guide/deployment.html"},{default:l(()=>[s("deployment")]),_:1}),s(" for how to deploy them.")]),R,B,e("p",null,[s("Next step, learn more about the "),a(o,{to:"/guide/configuration.html"},{default:l(()=>[s("configuration")]),_:1}),s(".")])])}const M=c(u,[["render",N],["__file","getting-started.html.vue"]]),Y=JSON.parse(`{"path":"/guide/getting-started.html","title":"Getting Started","lang":"en-US","frontmatter":{"description":"Getting Started Warning VuePress v2 is currently in RC (Release Candidate) stage. It's ready to be used for building your site, but the config and API are not stable enough, whi...","head":[["link",{"rel":"alternate","hreflang":"zh-cn","href":"https://v2.vuepress.vuejs.org/zh/guide/getting-started.html"}],["meta",{"property":"og:url","content":"https://v2.vuepress.vuejs.org/guide/getting-started.html"}],["meta",{"property":"og:site_name","content":"VuePress"}],["meta",{"property":"og:title","content":"Getting Started"}],["meta",{"property":"og:description","content":"Getting Started Warning VuePress v2 is currently in RC (Release Candidate) stage. It's ready to be used for building your site, but the config and API are not stable enough, whi..."}],["meta",{"property":"og:type","content":"article"}],["meta",{"property":"og:locale","content":"en-US"}],["meta",{"property":"og:locale:alternate","content":"zh-CN"}],["meta",{"property":"og:updated_time","content":"2024-08-31T08:01:19.000Z"}],["meta",{"property":"article:modified_time","content":"2024-08-31T08:01:19.000Z"}],["script",{"type":"application/ld+json"},"{\\"@context\\":\\"https://schema.org\\",\\"@type\\":\\"Article\\",\\"headline\\":\\"Getting Started\\",\\"image\\":[\\"\\"],\\"dateModified\\":\\"2024-08-31T08:01:19.000Z\\",\\"author\\":[]}"]]},"headers":[{"level":2,"title":"Try It Online","slug":"try-it-online","link":"#try-it-online","children":[]},{"level":2,"title":"Installation","slug":"installation","link":"#installation","children":[{"level":3,"title":"Prerequisites","slug":"prerequisites","link":"#prerequisites","children":[]},{"level":3,"title":"Project Setup","slug":"project-setup","link":"#project-setup","children":[]}]},{"level":2,"title":"Directory Structure","slug":"directory-structure","link":"#directory-structure","children":[]},{"level":2,"title":"Work with VuePress","slug":"work-with-vuepress","link":"#work-with-vuepress","children":[{"level":3,"title":"Start Dev Server","slug":"start-dev-server","link":"#start-dev-server","children":[]},{"level":3,"title":"Build Your Site","slug":"build-your-site","link":"#build-your-site","children":[]}]},{"level":2,"title":"Learn More about VuePress","slug":"learn-more-about-vuepress","link":"#learn-more-about-vuepress","children":[]}],"git":{"updatedTime":1725091279000,"contributors":[{"name":"meteorlxy","email":"meteor.lxy@foxmail.com","commits":5},{"name":"Mr.Hope","email":"mister-hope@outlook.com","commits":1}]},"autoDesc":true,"filePathRelative":"guide/getting-started.md"}`);export{M as comp,Y as data};
diff --git a/assets/hero-BNkrhNQ6.js b/assets/hero-BNkrhNQ6.js
new file mode 100644
index 000000000..d90d6d577
--- /dev/null
+++ b/assets/hero-BNkrhNQ6.js
@@ -0,0 +1 @@
+const o="/images/hero.png";export{o as _};
diff --git a/assets/i18n.html-9eIU_Fbw.js b/assets/i18n.html-9eIU_Fbw.js
new file mode 100644
index 000000000..96880550b
--- /dev/null
+++ b/assets/i18n.html-9eIU_Fbw.js
@@ -0,0 +1,39 @@
+import{_ as i,r as o,o as t,c,a as n,b as s,d as l,w as p,e}from"./app-CqHoxGIc.js";const r={},d=e(`
export default {
+ locales: {
+ // The key is the path for the locale to be nested under.
+ // As a special case, the default locale can use '/' as its path.
+ '/': {
+ lang: 'en-US',
+ title: 'VuePress',
+ description: 'Vue-powered Static Site Generator',
+ },
+ '/zh/': {
+ lang: 'zh-CN',
+ title: 'VuePress',
+ description: 'Vue 驱动的静态网站生成器',
+ },
+ },
+}
If a locale does not have a lang, title, description or head, VuePress will fallback to the root-level values. You can omit the root level config as long as they are provided in each locale.
VuePress does not restrict how themes provide multi-language support, so each theme may have different way to handle i18n, and some themes may not provide multi-language support at all. You'd better refer to the theme documentation for detailed guide.
If you are using default theme, the multi-language support is the same as above:
VuePress is a markdown-centered static site generator. You can write your content (documentations, blogs, etc.) in Markdown, then VuePress will help you to generate a static site to host them.
The purpose of creating VuePress was to support the documentation of Vue.js and its sub-projects, but now it has been helping a large amount of users to build their documentation, blogs, and other static sites.
A VuePress site is in fact a single-page application (SPA) powered by Vue and Vue Router.
Routes are generated according to the relative path of your markdown files. Each Markdown file is compiled into HTML with markdown-it and then processed as the template of a Vue component. This allows you to directly use Vue inside your Markdown files and is great when you need to embed dynamic content.
During development, we start a normal dev-server, and serve the VuePress site as a normal SPA. If you’ve used Vue before, you will notice the familiar development experience when you are writing and developing with VuePress.
During build, we create a server-rendered version of the VuePress site and render the corresponding HTML by virtually visiting each route. This approach is inspired by Nuxt's nuxt generate command and other projects like Gatsby.
Nuxt is an outstanding Vue SSR framework, and it is capable of doing what VuePress does. But Nuxt is designed for building applications, while VuePress is more lightweight and focused on content-centric static sites.
VitePress is the little brother of VuePress. It's also created and maintained by our Vue.js team. It's even more lightweight and faster than VuePress. However, as a tradeoff, it's more opinionated and less configurable. For example, it does not support plugins. But VitePress is powerful enough to make your content online if you don't need advanced customizations.
It might not be an appropriate comparison, but you can take VuePress and VitePress as Laravel and Lumen.
Both are great projects and also Vue-powered. Except they are both fully runtime-driven and therefore not SEO-friendly. If you don’t care for SEO and don’t want to mess with installing dependencies, these are still great choices.
Hexo has been serving the Vue 2.x docs well. The biggest problem is that its theming system is static and string-based - we want to take advantage of Vue for both the layout and the interactivity. Also, Hexo’s Markdown rendering isn’t the most flexible to configure.
We’ve been using GitBook for most of our sub project docs. The primary problem with GitBook is that its development reload performance is intolerable with a large amount of files. The default theme also has a pretty limiting navigation structure, and the theming system is, again, not Vue based. The team behind GitBook is also more focused on turning it into a commercial product rather than an open-source tool.
',20),i=[a];function s(d,l){return t(),o("div",null,i)}const h=e(r,[["render",s],["__file","introduction.html.vue"]]),u=JSON.parse('{"path":"/guide/introduction.html","title":"Introduction","lang":"en-US","frontmatter":{"description":"Introduction VuePress is a markdown-centered static site generator. You can write your content (documentations, blogs, etc.) in Markdown, then VuePress will help you to generate...","head":[["link",{"rel":"alternate","hreflang":"zh-cn","href":"https://v2.vuepress.vuejs.org/zh/guide/introduction.html"}],["meta",{"property":"og:url","content":"https://v2.vuepress.vuejs.org/guide/introduction.html"}],["meta",{"property":"og:site_name","content":"VuePress"}],["meta",{"property":"og:title","content":"Introduction"}],["meta",{"property":"og:description","content":"Introduction VuePress is a markdown-centered static site generator. You can write your content (documentations, blogs, etc.) in Markdown, then VuePress will help you to generate..."}],["meta",{"property":"og:type","content":"article"}],["meta",{"property":"og:locale","content":"en-US"}],["meta",{"property":"og:locale:alternate","content":"zh-CN"}],["meta",{"property":"og:updated_time","content":"2023-12-20T05:41:12.000Z"}],["meta",{"property":"article:modified_time","content":"2023-12-20T05:41:12.000Z"}],["script",{"type":"application/ld+json"},"{\\"@context\\":\\"https://schema.org\\",\\"@type\\":\\"Article\\",\\"headline\\":\\"Introduction\\",\\"image\\":[\\"\\"],\\"dateModified\\":\\"2023-12-20T05:41:12.000Z\\",\\"author\\":[]}"]]},"headers":[{"level":2,"title":"How It Works","slug":"how-it-works","link":"#how-it-works","children":[]},{"level":2,"title":"Why Not ...?","slug":"why-not","link":"#why-not","children":[{"level":3,"title":"Nuxt","slug":"nuxt","link":"#nuxt","children":[]},{"level":3,"title":"VitePress","slug":"vitepress","link":"#vitepress","children":[]},{"level":3,"title":"Docsify / Docute","slug":"docsify-docute","link":"#docsify-docute","children":[]},{"level":3,"title":"Hexo","slug":"hexo","link":"#hexo","children":[]},{"level":3,"title":"GitBook","slug":"gitbook","link":"#gitbook","children":[]}]}],"git":{"updatedTime":1703050872000,"contributors":[{"name":"meteorlxy","email":"meteor.lxy@foxmail.com","commits":1}]},"autoDesc":true,"filePathRelative":"guide/introduction.md"}');export{h as comp,u as data};
diff --git a/assets/making-a-theme-extendable.html-BMVOJX9y.js b/assets/making-a-theme-extendable.html-BMVOJX9y.js
new file mode 100644
index 000000000..9d88ddd5c
--- /dev/null
+++ b/assets/making-a-theme-extendable.html-BMVOJX9y.js
@@ -0,0 +1,30 @@
+import{_ as e,r as l,o,c as p,a as s,b as n,d as t,w as r,e as c}from"./app-CqHoxGIc.js";const i={},d=s("h1",{id:"开发一个可继承的主题",tabindex:"-1"},[s("a",{class:"header-anchor",href:"#开发一个可继承的主题"},[s("span",null,"开发一个可继承的主题")])],-1),y=s("p",null,"有时用户可能希望对一个主题进行一些小改动,但是又不想 Fork 并修改整个项目。",-1),D=c(`
`,12);function m(v,C){const a=l("RouteLink");return o(),p("div",null,[d,y,s("p",null,[n("借助于 "),t(a,{to:"/zh/reference/theme-api.html"},{default:r(()=>[n("主题 API")]),_:1}),n(" ,你可以让用户继承你的主题,允许用户对你的主题进行改动。")]),D])}const h=e(i,[["render",m],["__file","making-a-theme-extendable.html.vue"]]),b=JSON.parse('{"path":"/zh/advanced/cookbook/making-a-theme-extendable.html","title":"开发一个可继承的主题","lang":"zh-CN","frontmatter":{"description":"开发一个可继承的主题 有时用户可能希望对一个主题进行一些小改动,但是又不想 Fork 并修改整个项目。 借助于 ,你可以让用户继承你的主题,允许用户对你的主题进行改动。 你肯定已经知道了如何 继承默认主题 。接下来我们将介绍如何让你的主题像默认主题一样被用户继承。 布局插槽 这种方式需要你来决定主题的哪些部分是可以被扩展的,它更适合用于一些常见的自定义...","head":[["link",{"rel":"alternate","hreflang":"en-us","href":"https://v2.vuepress.vuejs.org/advanced/cookbook/making-a-theme-extendable.html"}],["meta",{"property":"og:url","content":"https://v2.vuepress.vuejs.org/zh/advanced/cookbook/making-a-theme-extendable.html"}],["meta",{"property":"og:site_name","content":"VuePress"}],["meta",{"property":"og:title","content":"开发一个可继承的主题"}],["meta",{"property":"og:description","content":"开发一个可继承的主题 有时用户可能希望对一个主题进行一些小改动,但是又不想 Fork 并修改整个项目。 借助于 ,你可以让用户继承你的主题,允许用户对你的主题进行改动。 你肯定已经知道了如何 继承默认主题 。接下来我们将介绍如何让你的主题像默认主题一样被用户继承。 布局插槽 这种方式需要你来决定主题的哪些部分是可以被扩展的,它更适合用于一些常见的自定义..."}],["meta",{"property":"og:type","content":"article"}],["meta",{"property":"og:locale","content":"zh-CN"}],["meta",{"property":"og:locale:alternate","content":"en-US"}],["meta",{"property":"og:updated_time","content":"2024-08-31T07:59:53.000Z"}],["meta",{"property":"article:modified_time","content":"2024-08-31T07:59:53.000Z"}],["script",{"type":"application/ld+json"},"{\\"@context\\":\\"https://schema.org\\",\\"@type\\":\\"Article\\",\\"headline\\":\\"开发一个可继承的主题\\",\\"image\\":[\\"\\"],\\"dateModified\\":\\"2024-08-31T07:59:53.000Z\\",\\"author\\":[]}"]]},"headers":[{"level":2,"title":"布局插槽","slug":"布局插槽","link":"#布局插槽","children":[]},{"level":2,"title":"组件别名","slug":"组件别名","link":"#组件别名","children":[]}],"git":{"updatedTime":1725091193000,"contributors":[{"name":"meteorlxy","email":"meteor.lxy@foxmail.com","commits":3},{"name":"Mr.Hope","email":"mister-hope@outlook.com","commits":1}]},"autoDesc":true,"filePathRelative":"zh/advanced/cookbook/making-a-theme-extendable.md"}');export{h as comp,b as data};
diff --git a/assets/making-a-theme-extendable.html-eeBKSgE0.js b/assets/making-a-theme-extendable.html-eeBKSgE0.js
new file mode 100644
index 000000000..7a8dd0b2f
--- /dev/null
+++ b/assets/making-a-theme-extendable.html-eeBKSgE0.js
@@ -0,0 +1,30 @@
+import{_ as n,r as l,o,c as t,a as s,b as e,d as p,w as r,e as c}from"./app-CqHoxGIc.js";const i={},d=s("h1",{id:"making-a-theme-extendable",tabindex:"-1"},[s("a",{class:"header-anchor",href:"#making-a-theme-extendable"},[s("span",null,"Making a Theme Extendable")])],-1),m=s("p",null,"Sometimes users might want make some minor changes to a theme, but they don't want to fork and modify the entire project.",-1),y=c(`
You must have known that how to extend default theme. Here we'll introduce how to make your own theme extendable like default theme.
This approach requires you to determine which parts of your theme could be extended. It is more suitable for those common customizations like page footer or header.
You just need to provide slots in your layouts, and tell users how to make use of them:
This approach requires you to consider which components of your theme should be replaceable, and you also need to split components into a suitable granularity.
First, set alias for replaceable components of you theme:
import type { Theme } from 'vuepress/core'
+import { getDirname } from 'vuepress/utils'
+
+const __dirname = getDirname(import.meta.url)
+
+export const fooTheme = (options): Theme => ({
+ name: 'vuepress-theme-foo',
+ alias: {
+ // set alias for replaceable components
+ '@theme/Navbar.vue': path.resolve(__dirname, 'components/Navbar.vue'),
+ '@theme/Sidebar.vue': path.resolve(__dirname, 'components/Sidebar.vue'),
+ },
+})
Next, use those components via aliases in your theme:
Then, users can replace specific components by overriding the alias when extending or using your theme.
`,12);function u(h,D){const a=l("RouteLink");return o(),t("div",null,[d,m,s("p",null,[e("With the help of "),p(a,{to:"/reference/theme-api.html"},{default:r(()=>[e("Theme API")]),_:1}),e(", you can make your theme extendable, allowing users to make their own modifications easily.")]),y])}const C=n(i,[["render",u],["__file","making-a-theme-extendable.html.vue"]]),b=JSON.parse(`{"path":"/advanced/cookbook/making-a-theme-extendable.html","title":"Making a Theme Extendable","lang":"en-US","frontmatter":{"description":"Making a Theme Extendable Sometimes users might want make some minor changes to a theme, but they don't want to fork and modify the entire project. With the help of , you can ma...","head":[["link",{"rel":"alternate","hreflang":"zh-cn","href":"https://v2.vuepress.vuejs.org/zh/advanced/cookbook/making-a-theme-extendable.html"}],["meta",{"property":"og:url","content":"https://v2.vuepress.vuejs.org/advanced/cookbook/making-a-theme-extendable.html"}],["meta",{"property":"og:site_name","content":"VuePress"}],["meta",{"property":"og:title","content":"Making a Theme Extendable"}],["meta",{"property":"og:description","content":"Making a Theme Extendable Sometimes users might want make some minor changes to a theme, but they don't want to fork and modify the entire project. With the help of , you can ma..."}],["meta",{"property":"og:type","content":"article"}],["meta",{"property":"og:locale","content":"en-US"}],["meta",{"property":"og:locale:alternate","content":"zh-CN"}],["meta",{"property":"og:updated_time","content":"2024-08-31T07:59:53.000Z"}],["meta",{"property":"article:modified_time","content":"2024-08-31T07:59:53.000Z"}],["script",{"type":"application/ld+json"},"{\\"@context\\":\\"https://schema.org\\",\\"@type\\":\\"Article\\",\\"headline\\":\\"Making a Theme Extendable\\",\\"image\\":[\\"\\"],\\"dateModified\\":\\"2024-08-31T07:59:53.000Z\\",\\"author\\":[]}"]]},"headers":[{"level":2,"title":"Layout Slots","slug":"layout-slots","link":"#layout-slots","children":[]},{"level":2,"title":"Component Aliases","slug":"component-aliases","link":"#component-aliases","children":[]}],"git":{"updatedTime":1725091193000,"contributors":[{"name":"meteorlxy","email":"meteor.lxy@foxmail.com","commits":3},{"name":"Mr.Hope","email":"mister-hope@outlook.com","commits":1}]},"autoDesc":true,"filePathRelative":"advanced/cookbook/making-a-theme-extendable.md"}`);export{C as comp,b as data};
diff --git a/assets/markdown-and-vue-sfc.html-D1DBAwNE.js b/assets/markdown-and-vue-sfc.html-D1DBAwNE.js
new file mode 100644
index 000000000..4befee6da
--- /dev/null
+++ b/assets/markdown-and-vue-sfc.html-D1DBAwNE.js
@@ -0,0 +1,30 @@
+import{_ as d,g as t,o as D,c as u,a as n,t as p,d as y,w as m,h as c,e as v}from"./app-CqHoxGIc.js";const C="Vue in Markdown",h={__name:"markdown-and-vue-sfc.html",setup(r,{expose:e}){e();const l=(i,o)=>c("div",{class:"red-div"},o.slots.default()),s=t(0),a={RedDiv:l,msg:C,count:s,h:c,ref:t};return Object.defineProperty(a,"__isScriptSetup",{enumerable:!1,value:!0}),a}},k=v(`
Each Markdown file is first compiled into HTML, and then converted to a Vue SFC. In other words, you can write a Markdown file like a Vue SFC:
Blocks <script> and <style> are treated as Vue SFC blocks as they are. In other words, they are hoisted from the <template> block to the top-level of SFC.
Everything outside <script> and <style> will be compiled into HTML, and be treated as Vue SFC <template> block.
Warning
As Vue SFC can contain only one <script> element, you should avoid using more than one <script> in VuePress markdown.
`,8);function g(r,e,l,s,a,i){return D(),u("div",null,[k,n("p",null,[n("em",null,"Hello, "+p(s.msg))]),y(s.RedDiv,null,{default:m(()=>[n("p",null,[n("em",null,"Current count is: "+p(s.count),1)])]),_:1}),n("p",null,[n("button",{onClick:e[0]||(e[0]=o=>s.count++)},"Click Me!")])])}const f=d(h,[["render",g],["__file","markdown-and-vue-sfc.html.vue"]]),w=JSON.parse('{"path":"/advanced/cookbook/markdown-and-vue-sfc.html","title":"Markdown and Vue SFC","lang":"en-US","frontmatter":{"description":"Markdown and Vue SFC Each Markdown file is first compiled into HTML, and then converted to a Vue SFC. In other words, you can write a Markdown file like a Vue SFC: Blocks c("div",{class:"red-div"},o.slots.default()),s=t(0),e={RedDiv:l,msg:C,count:s,h:c,ref:t};return Object.defineProperty(e,"__isScriptSetup",{enumerable:!1,value:!0}),e}},b=m(`
If your site is deployed to a non-root URL, for example, https://foo.github.io/bar/, then the base should be set to '/bar/'. Obviously, your public files would be served like https://foo.github.io/bar/images/hero.png after deployment.
In most cases, you don't need to worry about the reference path of those public files, as VuePress will automatically handle base for you:
<!-- you don't need to prepend `/bar/` to `/images/hero.png` manually -->
+
+![VuePress Logo](/images/hero.png)
However, sometimes you may have some dynamical links referencing public files, especially when you are authoring a custom theme. In such case, the base could not be handled automatically. To help with that, VuePress provides a withBase helper to prepend base for you: