docs: add ecosystem docs

vuepress · Jan 29, 2024 · 98bf7f7 · 98bf7f7
1 parent 20e5e46
commit 98bf7f7
Show file tree

Hide file tree

Showing 62 changed files with 8,315 additions and 90 deletions.
diff --git a/docs/.vuepress/components/NpmBadge.vue b/docs/.vuepress/components/NpmBadge.vue
@@ -0,0 +1,49 @@
+<script setup lang="ts">
+import { computed } from 'vue'
+
+const props = defineProps({
+  package: {
+    type: String,
+    required: true,
+  },
+  distTag: {
+    type: String,
+    required: false,
+    default: 'next',
+  },
+})
+
+const badgeLink = computed(
+  () => `https://www.npmjs.com/package/${props.package}`,
+)
+const badgeLabel = computed(() => {
+  if (props.distTag) {
+    return `${props.package}@${props.distTag}`
+  }
+  return props.package
+})
+const badgeImg = computed(
+  () =>
+    `https://badgen.net/npm/v/${props.package}/${
+      props.distTag
+    }?label=${encodeURIComponent(badgeLabel.value)}`,
+)
+</script>
+
+<template>
+  <a
+    class="npm-badge"
+    :href="badgeLink"
+    :title="package"
+    target="_blank"
+    rel="noopener noreferrer"
+  >
+    <img :src="badgeImg" :alt="package" />
+  </a>
+</template>
+
+<style scoped>
+.npm-badge {
+  margin-right: 0.5rem;
+}
+</style>
diff --git a/docs/.vuepress/config.ts b/docs/.vuepress/config.ts
@@ -0,0 +1,131 @@
+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 { registerComponentsPlugin } from '@vuepress/plugin-register-components'
+import { shikiPlugin } from '@vuepress/plugin-shiki'
+import { defineUserConfig } from 'vuepress'
+import type { UserConfig } from 'vuepress'
+import { getDirname, path } from 'vuepress/utils'
+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
+  base: '/',
+
+  // extra tags in `<head>`
+  head,
+
+  // site-level locales config
+  locales: {
+    '/': {
+      lang: 'en-US',
+      title: 'VuePress Ecosystem',
+      description: 'VuePress official themes plugins',
+    },
+    '/zh/': {
+      lang: 'zh-CN',
+      title: 'VuePress 生态系统',
+      description: 'VuePress 官方主题和插件',
+    },
+  },
+
+  // specify bundler via environment variable
+  bundler:
+    process.env.DOCS_BUNDLER === 'webpack' ? webpackBundler() : viteBundler(),
+
+  // configure markdown
+  markdown: {
+    importCode: {
+      handleImportPath: (importPath) => {
+        // handle @vuepress packages import path
+        if (importPath.startsWith('@vuepress/')) {
+          const packageName = importPath.match(/^(@vuepress\/[^/]*)/)![1]
+          return importPath
+            .replace(
+              packageName,
+              path.dirname(require.resolve(`${packageName}/package.json`)),
+            )
+            .replace('/src/', '/lib/')
+            .replace(/hotKey\.ts$/, 'hotKey.d.ts')
+        }
+        return importPath
+      },
+    },
+  },
+
+  // configure default theme
+  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: '点击反馈',
+    //           },
+    //         },
+    //       },
+    //     },
+    //   },
+    // }),
+    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',
+        })
+      : [],
+  ],
+}) as UserConfig
diff --git a/docs/.vuepress/configs/head.ts b/docs/.vuepress/configs/head.ts
@@ -0,0 +1,40 @@
+import type { HeadConfig } from 'vuepress/core'
+
+export const head: HeadConfig[] = [
+  [
+    'link',
+    {
+      rel: 'icon',
+      type: 'image/png',
+      sizes: '16x16',
+      href: `/images/icons/favicon-16x16.png`,
+    },
+  ],
+  [
+    'link',
+    {
+      rel: 'icon',
+      type: 'image/png',
+      sizes: '32x32',
+      href: `/images/icons/favicon-32x32.png`,
+    },
+  ],
+  ['link', { rel: 'manifest', href: '/manifest.webmanifest' }],
+  ['meta', { name: 'application-name', content: 'VuePress' }],
+  ['meta', { name: 'apple-mobile-web-app-title', content: 'VuePress' }],
+  ['meta', { name: 'apple-mobile-web-app-status-bar-style', content: 'black' }],
+  [
+    'link',
+    { rel: 'apple-touch-icon', href: `/images/icons/apple-touch-icon.png` },
+  ],
+  [
+    'link',
+    {
+      rel: 'mask-icon',
+      href: '/images/icons/safari-pinned-tab.svg',
+      color: '#3eaf7c',
+    },
+  ],
+  ['meta', { name: 'msapplication-TileColor', content: '#3eaf7c' }],
+  ['meta', { name: 'theme-color', content: '#3eaf7c' }],
+]
diff --git a/docs/.vuepress/configs/index.ts b/docs/.vuepress/configs/index.ts
@@ -0,0 +1,3 @@
+export * from './head.js'
+export * from './navbar/index.js'
+export * from './sidebar/index.js'
diff --git a/docs/.vuepress/configs/navbar/en.ts b/docs/.vuepress/configs/navbar/en.ts
@@ -0,0 +1,59 @@
+import type { NavbarConfig } from '@vuepress/theme-default'
+
+export const navbarEn: NavbarConfig = [
+  {
+    text: 'Themes',
+    children: [
+      {
+        text: 'Default Theme',
+        children: [
+          '/themes/default/config',
+          '/themes/default/frontmatter',
+          '/themes/default/components',
+          '/themes/default/markdown',
+          '/themes/default/styles',
+          '/themes/default/extending',
+        ],
+      },
+    ],
+  },
+  {
+    text: 'Plugins',
+    children: [
+      {
+        text: 'Common Features',
+        children: [
+          '/plugins/back-to-top',
+          '/plugins/container',
+          '/plugins/external-link-icon',
+          '/plugins/google-analytics',
+          '/plugins/medium-zoom',
+          '/plugins/nprogress',
+          '/plugins/register-components',
+        ],
+      },
+      {
+        text: 'Content Search',
+        children: ['/plugins/docsearch', '/plugins/search'],
+      },
+      {
+        text: 'PWA',
+        children: ['/plugins/pwa', '/plugins/pwa-popup'],
+      },
+      {
+        text: 'Syntax Highlighting',
+        children: ['/plugins/prismjs', '/plugins/shiki'],
+      },
+      {
+        text: 'Theme Development',
+        children: [
+          '/plugins/active-header-links',
+          '/plugins/git',
+          '/plugins/palette',
+          '/plugins/theme-data',
+          '/plugins/toc',
+        ],
+      },
+    ],
+  },
+]
diff --git a/docs/.vuepress/configs/navbar/index.ts b/docs/.vuepress/configs/navbar/index.ts
@@ -0,0 +1,2 @@
+export * from './en.js'
+export * from './zh.js'
diff --git a/docs/.vuepress/configs/navbar/zh.ts b/docs/.vuepress/configs/navbar/zh.ts
@@ -0,0 +1,59 @@
+import type { NavbarConfig } from '@vuepress/theme-default'
+
+export const navbarZh: NavbarConfig = [
+  {
+    text: '主题',
+    children: [
+      {
+        text: '默认主题',
+        children: [
+          '/zh/themes/default/config',
+          '/zh/themes/default/frontmatter',
+          '/zh/themes/default/components',
+          '/zh/themes/default/markdown',
+          '/zh/themes/default/styles',
+          '/zh/themes/default/extending',
+        ],
+      },
+    ],
+  },
+  {
+    text: '插件',
+    children: [
+      {
+        text: '常用功能',
+        children: [
+          '/zh/plugins/back-to-top',
+          '/zh/plugins/container',
+          '/zh/plugins/external-link-icon',
+          '/zh/plugins/google-analytics',
+          '/zh/plugins/medium-zoom',
+          '/zh/plugins/nprogress',
+          '/zh/plugins/register-components',
+        ],
+      },
+      {
+        text: '内容搜索',
+        children: ['/zh/plugins/docsearch', '/zh/plugins/search'],
+      },
+      {
+        text: 'PWA',
+        children: ['/zh/plugins/pwa', '/zh/plugins/pwa-popup'],
+      },
+      {
+        text: '语法高亮',
+        children: ['/zh/plugins/prismjs', '/zh/plugins/shiki'],
+      },
+      {
+        text: '主题开发',
+        children: [
+          '/zh/plugins/active-header-links',
+          '/zh/plugins/git',
+          '/zh/plugins/palette',
+          '/zh/plugins/theme-data',
+          '/zh/plugins/toc',
+        ],
+      },
+    ],
+  },
+]
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,2 @@
		export * from './en.js'
		export * from './zh.js'