feat: use theme-hope

.github/workflows/theme-hope-docs.yml

@@ -0,0 +1,39 @@
+name: Deploy docs with theme-hope
+
+on:
+  push:
+    branches:
+      - theme-hope
+
+jobs:
+  deploy-netlify:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+
+      - name: Install pnpm
+        uses: pnpm/action-setup@v2
+        with:
+          run_install: true
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: 20
+          cache: pnpm
+
+      - name: Build docs
+        env:
+          NODE_OPTIONS: --max_old_space_size=4096
+        run: |-
+          pnpm run docs:build
+          > docs/.vuepress/dist/.nojekyll
+
+      - name: Deploy docs
+        uses: JamesIves/github-pages-deploy-action@v4
+        with:
+          branch: netlify
+          folder: docs/.vuepress/dist

.vscode/settings.json

@@ -41,5 +41,6 @@
     "vuepress",
     "vueuse",
     "zoomable"
-  ]
+  ],
+  "markdown.extension.toc.updateOnSave": false
 }

README.md

@@ -6,10 +6,11 @@
 
 VuePress documentation repository.
 
+This branch holds a VuePress2 official docs powered by [VuePress Theme Hope](https://theme-hope.vuejs.press).
+
 ## Deployments
 
-- Release deployment: <https://v2.vuepress.vuejs.org>
-- Developer deployment: <https://vuepress.github.io>
+- Deployment: <https://vuejs.press>
 
 ## License
 

docs/.vuepress/config.ts

@@ -3,23 +3,14 @@ import process from 'node:process'
 import { viteBundler } from '@vuepress/bundler-vite'
 import { webpackBundler } from '@vuepress/bundler-webpack'
 import { docsearchPlugin } from '@vuepress/plugin-docsearch'
-import { googleAnalyticsPlugin } from '@vuepress/plugin-google-analytics'
 import { registerComponentsPlugin } from '@vuepress/plugin-register-components'
-import { shikiPlugin } from '@vuepress/plugin-shiki'
-import { defaultTheme } from '@vuepress/theme-default'
 import { defineUserConfig } from 'vuepress'
 import { getDirname, path } from 'vuepress/utils'
-import {
-  head,
-  navbarEn,
-  navbarZh,
-  sidebarEn,
-  sidebarZh,
-} from './configs/index.js'
+import { head } from './configs/index.js'
+import theme from './theme.js'
 
 const __dirname = getDirname(import.meta.url)
 const require = createRequire(import.meta.url)
-const isProd = process.env.NODE_ENV === 'production'
 
 export default defineUserConfig({
   // set site base to default value
@@ -46,72 +37,6 @@ export default defineUserConfig({
   bundler:
     process.env.DOCS_BUNDLER === 'webpack' ? webpackBundler() : viteBundler(),
 
-  // configure default theme
-  theme: defaultTheme({
-    hostname: 'https://v2.vuepress.vuejs.org',
-    logo: '/images/hero.png',
-    repo: 'vuepress/docs',
-    docsDir: 'docs',
-
-    // theme-level locales config
-    locales: {
-      /**
-       * English locale config
-       *
-       * As the default locale of @vuepress/theme-default is English,
-       * we don't need to set all of the locale fields
-       */
-      '/': {
-        // navbar
-        navbar: navbarEn,
-        // sidebar
-        sidebar: sidebarEn,
-        // page meta
-        editLinkText: 'Edit this page on GitHub',
-      },
-
-      /**
-       * Chinese locale config
-       */
-      '/zh/': {
-        // navbar
-        navbar: navbarZh,
-        selectLanguageName: '简体中文',
-        selectLanguageText: '选择语言',
-        selectLanguageAriaLabel: '选择语言',
-        // sidebar
-        sidebar: sidebarZh,
-        // page meta
-        editLinkText: '在 GitHub 上编辑此页',
-        lastUpdatedText: '上次更新',
-        contributorsText: '贡献者',
-        // custom containers
-        tip: '提示',
-        warning: '注意',
-        danger: '警告',
-        // 404 page
-        notFound: [
-          '这里什么都没有',
-          '我们怎么到这来了？',
-          '这是一个 404 页面',
-          '看起来我们进入了错误的链接',
-        ],
-        backToHome: '返回首页',
-        // a11y
-        openInNewWindow: '在新窗口打开',
-        toggleColorMode: '切换颜色模式',
-        toggleSidebar: '切换侧边栏',
-      },
-    },
-
-    themePlugins: {
-      // only enable git plugin in production mode
-      git: isProd,
-      // use shiki plugin in production mode instead
-      prismjs: !isProd,
-    },
-  }),
-
   // configure markdown
   markdown: {
     importCode: {
@@ -132,6 +57,8 @@ export default defineUserConfig({
     },
   },
 
+  theme,
+
   // use plugins
   plugins: [
     docsearchPlugin({
@@ -185,19 +112,8 @@ export default defineUserConfig({
         },
       },
     }),
-    googleAnalyticsPlugin({
-      // we have multiple deployments, which would use different id
-      id: process.env.DOCS_GA_ID ?? '',
-    }),
     registerComponentsPlugin({
       componentsDir: path.resolve(__dirname, './components'),
     }),
-    // only enable shiki plugin in production mode
-    isProd
-      ? shikiPlugin({
-          langs: ['bash', 'diff', 'json', 'md', 'ts', 'vue'],
-          theme: 'dark-plus',
-        })
-      : [],
   ],
 })

docs/.vuepress/configs/navbar/en.ts

@@ -1,9 +1,10 @@
-import type { NavbarConfig } from '@vuepress/theme-default'
+import { navbar } from 'vuepress-theme-hope'
 import { version } from '../meta.js'
 
-export const navbarEn: NavbarConfig = [
+export const enNavbar = navbar([
   {
     text: 'Guide',
+    icon: 'fa6-solid:lightbulb',
     children: [
       '/guide/introduction.md',
       '/guide/getting-started.md',
@@ -22,45 +23,48 @@ export const navbarEn: NavbarConfig = [
   },
   {
     text: 'Reference',
+    icon: 'fa6-solid:book',
+    prefix: '/reference/',
     children: [
       {
         text: 'VuePress',
         children: [
           {
             text: 'CLI',
-            link: '/reference/cli.html',
+            icon: 'bi:terminal-fill',
+            link: 'cli.html',
           },
-          '/reference/config.md',
-          '/reference/frontmatter.md',
-          '/reference/components.md',
-          '/reference/plugin-api.md',
-          '/reference/theme-api.md',
-          '/reference/client-api.md',
-          '/reference/node-api.md',
+          'config',
+          'frontmatter',
+          'components',
+          'plugin-api',
+          'theme-api',
+          'client-api',
+          'node-api',
         ],
       },
       {
         text: 'Bundlers',
-        children: [
-          '/reference/bundler/vite.md',
-          '/reference/bundler/webpack.md',
-        ],
+        prefix: 'bundler/',
+        children: ['vite', 'webpack'],
       },
     ],
   },
 
   {
     text: 'Learn More',
+    icon: 'fa6-solid:feather',
     children: [
       {
         text: 'Advanced',
+        prefix: '/advanced/',
         children: [
-          '/advanced/architecture.md',
-          '/advanced/plugin.md',
-          '/advanced/theme.md',
+          'architecture',
+          'plugin',
+          'theme',
           {
             text: 'Cookbook',
-            link: '/advanced/cookbook/',
+            link: 'cookbook/',
           },
         ],
       },
@@ -85,19 +89,22 @@ export const navbarEn: NavbarConfig = [
   },
   {
     text: `v${version}`,
+    icon: 'fa6-solid:tag',
     children: [
       {
         text: 'Changelog',
-        link: 'https://github.com/vuepress/core/blob/main/CHANGELOG.md',
+        link: 'https://github.com/vuepress/vuepress-next/blob/main/CHANGELOG.md',
       },
       {
         text: 'v1.x',
+        icon: 'fa6-brands:vuejs',
         link: 'https://v1.vuepress.vuejs.org',
       },
       {
         text: 'v0.x',
+        icon: 'fa6-brands:vuejs',
         link: 'https://v0.vuepress.vuejs.org',
       },
     ],
   },
-]
+])

docs/.vuepress/configs/navbar/zh.ts

@@ -1,9 +1,10 @@
-import type { NavbarConfig } from '@vuepress/theme-default'
+import { navbar } from 'vuepress-theme-hope'
 import { version } from '../meta.js'
 
-export const navbarZh: NavbarConfig = [
+export const zhNavbar = navbar([
   {
     text: '指南',
+    icon: 'fa6-solid:lightbulb',
     children: [
       '/zh/guide/introduction.md',
       '/zh/guide/getting-started.md',
@@ -22,41 +23,43 @@ export const navbarZh: NavbarConfig = [
   },
   {
     text: '参考',
+    icon: 'fa6-solid:book',
+    prefix: '/zh/reference/',
     children: [
       {
         text: 'VuePress',
         children: [
-          '/zh/reference/cli.md',
-          '/zh/reference/config.md',
-          '/zh/reference/frontmatter.md',
-          '/zh/reference/components.md',
-          '/zh/reference/plugin-api.md',
-          '/zh/reference/theme-api.md',
-          '/zh/reference/client-api.md',
-          '/zh/reference/node-api.md',
+          'cli',
+          'config',
+          'frontmatter',
+          'components',
+          'plugin-api',
+          'theme-api',
+          'client-api',
+          'node-api',
         ],
       },
       {
         text: '打包工具',
-        children: [
-          '/zh/reference/bundler/vite.md',
-          '/zh/reference/bundler/webpack.md',
-        ],
+        prefix: 'bundler/',
+        children: ['vite', 'webpack'],
       },
     ],
   },
   {
     text: '了解更多',
+    icon: 'fa6-solid:feather',
     children: [
       {
         text: '深入',
+        prefix: '/zh/advanced/',
         children: [
-          '/zh/advanced/architecture.md',
-          '/zh/advanced/plugin.md',
-          '/zh/advanced/theme.md',
+          'architecture',
+          'plugin',
+          'theme',
           {
             text: 'Cookbook',
-            link: '/zh/advanced/cookbook/',
+            link: 'cookbook/',
           },
         ],
       },
@@ -81,19 +84,22 @@ export const navbarZh: NavbarConfig = [
   },
   {
     text: `v${version}`,
+    icon: 'fa6-solid:tag',
     children: [
       {
         text: '更新日志',
-        link: 'https://github.com/vuepress/core/blob/main/CHANGELOG.md',
+        link: 'https://github.com/vuepress/vuepress-next/blob/main/CHANGELOG.md',
       },
       {
         text: 'v1.x',
+        icon: 'fa6-brands:vuejs',
         link: 'https://v1.vuepress.vuejs.org/zh/',
       },
       {
         text: 'v0.x',
+        icon: 'fa6-brands:vuejs',
         link: 'https://v0.vuepress.vuejs.org/zh/',
       },
     ],
   },
-]
+])