feat: 基于@142vip/vuepress对站点升级，简化配置、优化整体结构 (#149)

2026-02-03 02:23:38 +08:00 · 2025-05-18 17:28:07 +08:00
parent 866d943b17
commit 42614cde10
13 changed files with 824 additions and 616 deletions
--- a/README.md
+++ b/README.md
@@ -60,6 +60,29 @@
 - 注意学科学习顺序，建议：`数据结构` --> `操作系统`、`计算机组成原理` --> `计算机网络`
 - **学习切忌浮于表面，需戒骄戒躁**。408考试知识点多、杂，非常容易忘，**抓大放小、先易后难、反复多次**

+## 本地浏览【推荐】
+
+由于平台、网络等原因，在线浏览容易出现加载面、加载不出来等常见问题，因此非常建议在本地进行浏览、学习；**下面指令默认你已经安装[Git](https://git-scm.com/download)、[NPM](https://www.npmjs.com/)、[PNPM](https://www.pnpm.cn/)、[Node](http://nodejs.cn)等环境，并对此有一定了解!**
+
+```bash:no-line-numbers
+## 进入cmd命令行，直接克隆仓库
+git clone https://github.com/mmdapl/408CSFamily.git
+
+## 进入408CSFamily文件夹中
+cd 408CSFamily
+
+## tips: 如果本地已经clone过仓库，建议执行pull指令，获取最新
+git pull
+
+## 下载依赖包
+pnpm install
+
+## 执行dev指令，本地启动项目，打开http://localhost:4200即可访问文档
+pnpm dev
+```
+
+查看项目启动日志并访问：[http://127.0.0.1:4200](http://localhost:4200)，开启学习之旅吧~
+
 ## 在线浏览

 - 稳定版： <https://408.142vip.cn>
@@ -81,8 +104,8 @@

 ### 学习视频

-> **不是王道工作人员，不做任何推销**，只是感觉看书不太行的话还是得找找视频辅助下，就发现了王道官方视频，
-> 我自己有时也会用这个，如果链接失效可以去B站搜！
+> **不是王道工作人员，不做任何推销**，只是感觉看书不太行的话还是得找找视频辅助下，就发现了王道官方视频。
+> **如果链接失效可以去B站搜！**

 - [数据结构](https://www.bilibili.com/video/BV1b7411N798)
 - [计算机组成原理](https://www.bilibili.com/video/BV1BE411D7ii)
@@ -321,8 +344,6 @@

 <!-- #endregion quick-start -->

-[//]: # '宣传内容'
-
 <!-- #region we-media -->

 ## 赞赏列表
--- a/docs/.vuepress/public/mind-map/ccp-map.html
+++ b/docs/.vuepress/public/mind-map/ccp-map.html
@@ -16,11 +16,11 @@
  height: 100vh;
 }
 </style>
-<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/markmap-toolbar@0.18.9/dist/style.css"><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@highlightjs/cdn-assets@11.11.1/styles/default.min.css">
+<link rel="stylesheet" href="https://unpkg.com/markmap-toolbar@0.18.9/dist/style.css"><link rel="stylesheet" href="https://unpkg.com/@highlightjs/cdn-assets@11.11.1/styles/default.min.css">
 </head>
 <body>
 <svg id="mindmap"></svg>
-<script src="https://cdn.jsdelivr.net/npm/d3@7.9.0/dist/d3.min.js"></script><script src="https://cdn.jsdelivr.net/npm/markmap-view@0.18.9/dist/browser/index.js"></script><script src="https://cdn.jsdelivr.net/npm/markmap-toolbar@0.18.9/dist/index.js"></script><script>((r) => {
+<script src="https://unpkg.com/d3@7.9.0/dist/d3.min.js"></script><script src="https://unpkg.com/markmap-view@0.18.9/dist/browser/index.js"></script><script src="https://unpkg.com/markmap-toolbar@0.18.9/dist/index.js"></script><script>((r) => {
          setTimeout(r);
        })(() => {
  const { markmap, mm } = window;
--- a/docs/.vuepress/public/mind-map/cn-map.html
+++ b/docs/.vuepress/public/mind-map/cn-map.html
@@ -16,11 +16,11 @@
  height: 100vh;
 }
 </style>
-<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/markmap-toolbar@0.18.9/dist/style.css"><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@highlightjs/cdn-assets@11.11.1/styles/default.min.css">
+<link rel="stylesheet" href="https://unpkg.com/markmap-toolbar@0.18.9/dist/style.css"><link rel="stylesheet" href="https://unpkg.com/@highlightjs/cdn-assets@11.11.1/styles/default.min.css">
 </head>
 <body>
 <svg id="mindmap"></svg>
-<script src="https://cdn.jsdelivr.net/npm/d3@7.9.0/dist/d3.min.js"></script><script src="https://cdn.jsdelivr.net/npm/markmap-view@0.18.9/dist/browser/index.js"></script><script src="https://cdn.jsdelivr.net/npm/markmap-toolbar@0.18.9/dist/index.js"></script><script>((r) => {
+<script src="https://unpkg.com/d3@7.9.0/dist/d3.min.js"></script><script src="https://unpkg.com/markmap-view@0.18.9/dist/browser/index.js"></script><script src="https://unpkg.com/markmap-toolbar@0.18.9/dist/index.js"></script><script>((r) => {
          setTimeout(r);
        })(() => {
  const { markmap, mm } = window;
--- a/docs/.vuepress/public/mind-map/ds-map.html
+++ b/docs/.vuepress/public/mind-map/ds-map.html
@@ -16,11 +16,11 @@
  height: 100vh;
 }
 </style>
-<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/markmap-toolbar@0.18.9/dist/style.css"><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@highlightjs/cdn-assets@11.11.1/styles/default.min.css">
+<link rel="stylesheet" href="https://unpkg.com/markmap-toolbar@0.18.9/dist/style.css"><link rel="stylesheet" href="https://unpkg.com/@highlightjs/cdn-assets@11.11.1/styles/default.min.css">
 </head>
 <body>
 <svg id="mindmap"></svg>
-<script src="https://cdn.jsdelivr.net/npm/d3@7.9.0/dist/d3.min.js"></script><script src="https://cdn.jsdelivr.net/npm/markmap-view@0.18.9/dist/browser/index.js"></script><script src="https://cdn.jsdelivr.net/npm/markmap-toolbar@0.18.9/dist/index.js"></script><script>((r) => {
+<script src="https://unpkg.com/d3@7.9.0/dist/d3.min.js"></script><script src="https://unpkg.com/markmap-view@0.18.9/dist/browser/index.js"></script><script src="https://unpkg.com/markmap-toolbar@0.18.9/dist/index.js"></script><script>((r) => {
          setTimeout(r);
        })(() => {
  const { markmap, mm } = window;
--- a/docs/.vuepress/public/mind-map/os-map.html
+++ b/docs/.vuepress/public/mind-map/os-map.html
@@ -16,11 +16,11 @@
  height: 100vh;
 }
 </style>
-<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/markmap-toolbar@0.18.9/dist/style.css"><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@highlightjs/cdn-assets@11.11.1/styles/default.min.css">
+<link rel="stylesheet" href="https://unpkg.com/markmap-toolbar@0.18.9/dist/style.css"><link rel="stylesheet" href="https://unpkg.com/@highlightjs/cdn-assets@11.11.1/styles/default.min.css">
 </head>
 <body>
 <svg id="mindmap"></svg>
-<script src="https://cdn.jsdelivr.net/npm/d3@7.9.0/dist/d3.min.js"></script><script src="https://cdn.jsdelivr.net/npm/markmap-view@0.18.9/dist/browser/index.js"></script><script src="https://cdn.jsdelivr.net/npm/markmap-toolbar@0.18.9/dist/index.js"></script><script>((r) => {
+<script src="https://unpkg.com/d3@7.9.0/dist/d3.min.js"></script><script src="https://unpkg.com/markmap-view@0.18.9/dist/browser/index.js"></script><script src="https://unpkg.com/markmap-toolbar@0.18.9/dist/index.js"></script><script>((r) => {
          setTimeout(r);
        })(() => {
  const { markmap, mm } = window;
--- a/docs/CHANGELOG.md
+++ b/docs/CHANGELOG.md
@@ -1,16 +1,18 @@
 ---
 title: 变更记录
 permalink: /changelog.html
-levels: false
+# 设置右侧标题显示
+toc:
+  levels: 2
 ---

 # 变更记录

-该文件包含 `408CSFamily` 仓库和网站所有显着更改。
+**该文件包含 `408CSFamily` 仓库和网站所有显着更改。**

 <!-- @include: ../CHANGELOG.md#recent-alpha -->

-## 更多...
+## 更多变更

 ::: tip

--- a/docs/README.md
+++ b/docs/README.md
@@ -36,40 +36,6 @@ features:
    details: 好的学习方法便成功了一半，记忆是会遗忘的，面对408考试多、乱、杂的知识点，反复、多次学习尤为重要
 ---

-## 本地浏览【推荐】
-
-由于平台、网络等原因，在线浏览容易出现加载面、加载不出来等常见问题，因此非常建议在本地进行浏览、学习；**下面指令默认你已经安装[Git](https://git-scm.com/download)、[NPM](https://www.npmjs.com/)、[PNPM](https://www.pnpm.cn/)、[Node](http://nodejs.cn)等环境，并对此有一定了解!**
-
-```bash:no-line-numbers
-## 进入cmd命令行，直接克隆仓库
-git clone https://github.com/mmdapl/408CSFamily.git
-
-## 进入408CSFamily文件夹中
-cd 408CSFamily
-
-## tips: 如果本地已经clone过仓库，建议执行pull指令，获取最新
-git pull
-
-## 下载依赖包
-pnpm install
-
-## 执行dev指令，本地启动项目，打开http://localhost:4200即可访问文档
-pnpm dev
-
-```
-
-查看项目启动日志并访问：[http://127.0.0.1:4200](http://localhost:4200)，开启学习之旅吧~
-
-## 在线浏览
-
- 稳定版： <https://408.142vip.cn>
-
-> 网站无法访问时，合理使用魔法、通过科学上网访问第三方托管平台
-
- Github： <https://142vip.github.io/408CSFamily>
- Netlify： <https://408-family.netlify.app>
- Vercel： <https://408-family.vercel.app>
-
-[//]: # '自动引入首页'
+<!-- @include: ../README.md#quick-start -->

 <!-- @include: ../README.md#we-media -->
--- a/docs/theme.config.ts
+++ b/docs/theme.config.ts
@@ -18,7 +18,7 @@ export const navbarConfig = defineVipNavbarConfig([
  {
    text: '👉 了解更多',
    children: [
-      { text: '📄 更新日志', link: '/changelog.md' },
+      { text: '📄 变更记录', link: '/changelog.md' },
      { text: '📣 网站动态', link: '/big-event-history.md' },
      {
        text: '自媒体',
--- a/package.json
+++ b/package.json
@@ -33,8 +33,9 @@
    "@142vip/commit-linter": "0.0.1-alpha.2",
    "@142vip/eslint-config": "0.0.1-alpha.4",
    "@142vip/fairy-cli": "0.0.3-alpha.25",
-    "@142vip/utils": "0.0.1-alpha.36",
-    "@142vip/vuepress": "0.0.1-alpha.15",
+    "@142vip/open-source": "0.0.1-alpha.3",
+    "@142vip/utils": "0.0.1-alpha.37",
+    "@142vip/vuepress": "0.0.1-alpha.17",
    "markmap-cli": "0.18.9",
    "only-allow": "1.2.1",
    "simple-git-hooks": "2.11.1",
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
--- a/scripts/core/build-image.ts
+++ b/scripts/core/build-image.ts
@@ -1,6 +1,5 @@
+import { OPEN_SOURCE_ADDRESS, OPEN_SOURCE_AUTHOR } from '@142vip/open-source'
 import {
-  OPEN_SOURCE_ADDRESS,
-  OPEN_SOURCE_AUTHOR,
  VipConsole,
  VipDocker,
  VipGit,
--- a/scripts/core/verify-commit.ts
+++ b/scripts/core/verify-commit.ts
@@ -4,7 +4,7 @@ import { VipColor, VipConsole, vipLogger } from '@142vip/utils'
 /**
 * 验证Git Commit信息
 */
-async function verifyCommitMain(): Promise<void> {
+function verifyCommitMain(): void {
  const { type, scope, subject, commit } = commitLiner()

  // 提交符合规范，打印相关信息
--- a/vuepress.config.ts
+++ b/vuepress.config.ts
@@ -1,28 +1,101 @@
-import { getDocSiteBase, GitGeneralBranch, OPEN_SOURCE_ADDRESS, OPEN_SOURCE_AUTHOR, VipPackageJSON } from '@142vip/utils'
+import { OPEN_SOURCE_ADDRESS, OPEN_SOURCE_AUTHOR } from '@142vip/open-source'
+import { GitGeneralBranch, vipDocSite, VipPackageJSON } from '@142vip/utils'
 import {
  defineVipVuepressConfig,
-  FamilyHeaders,
-  getCopyRightText,
-  getFooterHtml,
  getVipHopeTheme,
  handleImportCodePath,
+  VUEPRESS_DEFAULT_DOCS_DIR,
 } from '@142vip/vuepress'
 import { navbarConfig, sidebarConfig } from './docs/theme.config'

 const pkg = VipPackageJSON.getPackageJSON<{ description: string }>()

+/**
+ * 页脚
+ */
+const footerHtmlStr = `
+<div>
+    All Rights Reserved
+    <a href="${OPEN_SOURCE_ADDRESS.HOME_PAGE_GITHUB_VIP}" target="_blank">@${OPEN_SOURCE_ADDRESS.GITHUB_ORGANIZATION_NAME}</a> | 
+    <strong>${pkg.name}@v${pkg.version} </strong>
+</div>
+<div style="margin-top: 5px">
+  <a href="${OPEN_SOURCE_ADDRESS.BAIDU_STATISTICS_URL}" target="_blank">${OPEN_SOURCE_ADDRESS.BAIDU_STATISTICS_NAME}</a> 
+  <span style="margin: 0 5px;">|</span>
+  <a href="${OPEN_SOURCE_ADDRESS.BEI_AN_URL}" target="_blank">${OPEN_SOURCE_ADDRESS.BEI_AN_NAME}</a>
+</div>
+`
+
+/**
+ * 版权信息
+ */
+const copyrightHtmlStr = `
+<strong>MIT 协议</strong> | 版权所有 © 2015-${new Date().getFullYear()} ${OPEN_SOURCE_AUTHOR.name}
+<div style="margin-top: 10px">
+    <a
+      href="${OPEN_SOURCE_ADDRESS.SITE_DEPLOY_408CS_FAMILY_GITHUB}"
+      target="_blank"
+      style="padding: 5px"
+    >
+        <!--src="https://img.shields.io/github/deployments/142vip/408CSFamily/github-pages?label=github&logo=github" -->
+        <img
+          alt="408CSFamily Deploy In Github Pages"
+          src="https://img.shields.io/badge/github-success-green?logo=github&color=bef9c6"
+        >
+    </a>
+    <a
+      href="${OPEN_SOURCE_ADDRESS.SITE_DEPLOY_408CS_FAMILY_NETLIFY}"
+      target="_blank"
+      style="padding: 5px"
+    >
+        <!--src="https://api.netlify.com/api/v1/badges/75a7251a-f873-4aff-b387-6449ca241ef7/deploy-status" -->
+        <img
+          alt="408CSFamily Deploy In Netlify"
+          src="https://img.shields.io/badge/netlify-success-green?logo=netlify&color=bef9c6"
+        >
+    </a>
+    <a
+      href="${OPEN_SOURCE_ADDRESS.SITE_DEPLOY_408CS_FAMILY_VERCEL}"
+      target="_blank"
+      style="padding: 5px"
+    >
+        <!--src="https://deploy-badge.vercel.app/vercel/408-family" -->
+        <img
+          src="https://img.shields.io/badge/vercel-success-green?logo=vercel&color=bef9c6"
+          alt="408CSFamily Deploy In Vercel"
+        >
+    </a>
+</div>
+`
+
 /**
 * 用户自定义配置
 * 注意：
 *  - 环境变量中的PROXY_DOMAIN字段，用于区分是否nginx代理
 */
 export default defineVipVuepressConfig({
-  base: getDocSiteBase(pkg.name),
+  base: vipDocSite.getBase(pkg.name),
  title: '计算机408全家桶',
  description: '磨刀不误砍柴工，读完硕士再打工',
  port: 4200,
  source: '',
-  head: FamilyHeaders,
+  head: [
+    ['link', { rel: 'icon', href: 'favicon.ico' }],
+    // vercel统计 相关配置
+    ['script', { type: 'text/javascript', src: '/_vercel/insights/script.js' }],
+    // 百度统计
+    [
+      'script',
+      {},
+      `var _hmt = _hmt || [];
+    (function() {
+      var hm = document.createElement("script");
+      hm.src = "https://hm.baidu.com/hm.js?3515cc46ae60747b778140f0e5e22dfe";
+      var s = document.getElementsByTagName("script")[0];
+      s.parentNode.insertBefore(hm, s);
+    })();`,
+    ],
+  ],
  markdown: {
    importCode: {
      handleImportPath: handleImportCodePath([
@@ -48,28 +121,24 @@ export default defineVipVuepressConfig({
    },
    logo: '/logo.png',
    logoDark: '/logo.png',
-    // todo 拓展OPEN_SOURCE_AUTHOR
-    hostname: 'https://408.142vip.cn',
+    hostname: OPEN_SOURCE_ADDRESS.HOME_PAGE_DOMAIN_408,
    // 页脚
-    footer: getFooterHtml({
-      name: pkg.name,
-      version: pkg.version,
-    }),
+    footer: footerHtmlStr,
    // 版权
-    copyright: getCopyRightText(OPEN_SOURCE_AUTHOR.name),
+    copyright: copyrightHtmlStr,
    // 仓库 142vip/408CSFamily
    repo: `${OPEN_SOURCE_ADDRESS.GITHUB_ORGANIZATION_NAME}/${pkg.name}`,
-    repoLabel: 'GitHub',

    // 作者信息
    author: OPEN_SOURCE_AUTHOR,

    // 文档路径，开启编辑功能
-    docsDir: 'docs',
+    docsDir: VUEPRESS_DEFAULT_DOCS_DIR,
    docsBranch: GitGeneralBranch.NEXT,
    // 主题布局选项
    docsRepo: OPEN_SOURCE_ADDRESS.GITHUB_REPO_408,

+    contributors: true,
    // 插件
    plugins: {
      // 水印
@@ -79,8 +148,6 @@ export default defineVipVuepressConfig({
          content: OPEN_SOURCE_AUTHOR.name,
        },
      },
-      git: true,
    },
  }),
-  shouldPrefetch: false,
 })