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,9 +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://vuepress.vuejs.org>
+- Release deployment: <https://vuejs.press>
 - Developer deployment: <https://vuepress.github.io>
 
 ## License

docs/.vuepress/config.ts

@@ -2,24 +2,14 @@ import { createRequire } from 'node:module'
 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,73 +36,6 @@ export default defineUserConfig({
   bundler:
     process.env.DOCS_BUNDLER === 'webpack' ? webpackBundler() : viteBundler(),
 
-  // configure default theme
-  theme: defaultTheme({
-    hostname: 'https://vuepress.vuejs.org',
-    logo: '/images/hero.png',
-    repo: 'vuepress/core',
-    docsRepo: '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: {
@@ -133,72 +56,12 @@ export default defineUserConfig({
     },
   },
 
+  theme,
+
   // use plugins
   plugins: [
-    docsearchPlugin({
-      appId: '34YFD9IUQ2',
-      apiKey: '9a9058b8655746634e01071411c366b8',
-      indexName: 'vuepress',
-      searchParameters: {
-        facetFilters: ['tags:v2'],
-      },
-      locales: {
-        '/zh/': {
-          placeholder: '搜索文档',
-          translations: {
-            button: {
-              buttonText: '搜索文档',
-              buttonAriaLabel: '搜索文档',
-            },
-            modal: {
-              searchBox: {
-                resetButtonTitle: '清除查询条件',
-                resetButtonAriaLabel: '清除查询条件',
-                cancelButtonText: '取消',
-                cancelButtonAriaLabel: '取消',
-              },
-              startScreen: {
-                recentSearchesTitle: '搜索历史',
-                noRecentSearchesText: '没有搜索历史',
-                saveRecentSearchButtonTitle: '保存至搜索历史',
-                removeRecentSearchButtonTitle: '从搜索历史中移除',
-                favoriteSearchesTitle: '收藏',
-                removeFavoriteSearchButtonTitle: '从收藏中移除',
-              },
-              errorScreen: {
-                titleText: '无法获取结果',
-                helpText: '你可能需要检查你的网络连接',
-              },
-              footer: {
-                selectText: '选择',
-                navigateText: '切换',
-                closeText: '关闭',
-                searchByText: '搜索提供者',
-              },
-              noResultsScreen: {
-                noResultsText: '无法找到相关结果',
-                suggestedQueryText: '你可以尝试查询',
-                reportMissingResultsText: '你认为该查询应该有结果？',
-                reportMissingResultsLinkText: '点击反馈',
-              },
-            },
-          },
-        },
-      },
-    }),
-    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 { NavbarOptions } from '@vuepress/theme-default'
+import { navbar } from 'vuepress-theme-hope'
 import { VERSION } from '../meta.js'
 
-export const navbarEn: NavbarOptions = [
+export const NAVBAR_EN = navbar([
   {
     text: 'Guide',
+    icon: 'fa6-solid:lightbulb',
     children: [
       '/guide/introduction.md',
       '/guide/getting-started.md',
@@ -22,39 +23,42 @@ export const navbarEn: NavbarOptions = [
   },
   {
     text: 'Reference',
+    icon: 'fa6-solid:book',
+    prefix: '/reference/',
     children: [
       {
         text: 'Core',
         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: 'Ecosystem',
         children: [
           {
             text: 'Default Theme',
+            icon: 'fa6-solid:palette',
             link: 'https://ecosystem.vuejs.press/themes/default/',
           },
           {
             text: 'Plugins',
+            icon: 'fa6-solid:puzzle-piece',
             link: 'https://ecosystem.vuejs.press/plugins/',
           },
         ],
@@ -64,16 +68,19 @@ export const navbarEn: NavbarOptions = [
 
   {
     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/',
+            icon: 'fa6-solid:signs-post',
+            link: 'cookbook/',
           },
         ],
       },
@@ -82,14 +89,17 @@ export const navbarEn: NavbarOptions = [
         children: [
           {
             text: 'Ecosystem',
+            icon: 'fa6-solid:leaf',
             link: 'https://ecosystem.vuejs.press/',
           },
           {
             text: 'MarketPlace',
+            icon: 'fa6-solid:cart-shopping',
             link: 'https://marketplace.vuejs.press',
           },
           {
             text: 'Contributing Guide',
+            icon: 'fa6-solid:signs-post',
             link: 'https://github.com/vuepress/core/blob/main/CONTRIBUTING.md',
           },
         ],
@@ -101,17 +111,19 @@ export const navbarEn: NavbarOptions = [
     children: [
       {
         text: 'Changelog',
-        link: 'https://github.com/vuepress/core/blob/main/CHANGELOG.md',
+        icon: 'fa6-solid:clock',
+        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',
       },
     ],
   },
-  // TODO: remove the type assertion
-] as NavbarOptions
+])