创建vuepress项目

docs/.vuepress/config.js

@@ -0,0 +1,203 @@
+module.exports = {
+  lang: 'zh-CN',
+  title: 'Coz的学习笔记',
+  description: '这是我的第一个 VuePress 站点',
+
+  head: [
+    ['link', { rel: 'icon', href: '/images/logo.png' }],
+    ['link', { rel: 'stylesheet', href: '/css/search.css' }],
+  ],
+
+  base: '/',
+
+  host: 'localhost',
+  port: 80,
+
+  // 修改后自动打开网页
+  // open: true,
+
+  // https://v2.vuepress.vuejs.org/zh/reference/plugin-api.html#extendsmarkdown
+  extendsMarkdown: (md) => {
+    // https://github.com/MakerGYT/markdown-it-latex2img
+    // md.use(require("markdown-it-latex2img"));
+
+    // https://github.com/MakerGYT/markdown-it-latex2img
+    md.use(require("markdown-it-mathjax3"));
+
+    md.linkify.set({ fuzzyEmail: false });
+
+    // md.use(require("markdown-it-disable-url-encode"));
+  },
+
+  plugins: [
+    [
+      '@vuepress/plugin-search',
+      {
+        locales: {
+          '/': {
+            placeholder: '在笔记中搜索一下...',
+          },
+        },
+
+        // 排除首页
+        isSearchable: (page) => page.path !== '/',
+      },
+    ],
+  ],
+
+  markdown: {
+    // https://github.com/valeriangalliat/markdown-it-anchor/blob/master/README-zh_CN.md
+    anchor: {
+      level: [1, 2, 3, 4, 5, 6],
+    },
+
+    // VuePress 内置的 markdown-it extract-headers 插件的配置项。
+    // 它将会把页面的子标题提取到 Page Data 中，可以用于生成侧边栏、目录等。
+    // https://v2.vuepress.vuejs.org/zh/reference/config.html#markdown-extractheaders
+    extractHeaders: {
+      // 需要提取的子标题层级。
+      level: [2, 3, 4],
+    },
+
+    toc: {
+      includeLevel: [2, 3, 4],
+
+      // 需要包含在目录中的子标题层级
+      // 它应该是 markdown.anchor.level 选项的一个子集，以便确保目录中的链接是存在的。
+      // https://v2.vuepress.vuejs.org/zh/reference/config.html#markdown-toc-level
+      level: [2, 3, 4],
+    },
+  },
+
+  // theme: 'vuepress-theme-foo',
+
+  themeConfig: {
+    logo: '/images/logo.png',
+    // logoDark: null,
+
+    lastUpdated: true,
+
+    sidebarDepth: 6,
+
+    // https://v2.vuepress.vuejs.org/zh/reference/default-theme/config.html
+    // repo: 'vuejs/vuepress',
+    // repoLabel: '',
+    // editLink: '',
+    // editLinkText: '',
+    // editLinkPattern: '',
+    // : '',
+    // : '',
+
+    // lastUpdated: true,
+
+    backToHome: '回到首页',
+
+
+    navbar: [
+
+      {
+        text: '首页',
+        link: '/'
+      },
+      {
+        text: '目录',
+        children: [
+          {
+            text: '目录',
+            link: '/guide'
+          },
+          {
+            text: '笔记',
+            children: [
+              {
+                text: '计算机网络笔记',
+                link: '/computer-networks'
+              }
+            ],
+          },
+          {
+            text: '其他',
+            children: [
+              {
+                text: 'Web服务器',
+                link: '/web-server/'
+              }
+            ],
+          }
+        ],
+      },
+      /*
+      // NavbarItem
+      {
+        text: 'Foo',
+        link: '/foo/',
+      },
+
+      // NavbarGroup
+      {
+        text: 'Group',
+        children: ['/group/foo.md', '/group/bar.md'],
+      },
+
+      // 字符串 - 页面文件路径
+      '/bar/README.md',
+
+      // 嵌套 Group - 最大深度为 2
+      {
+        text: 'Group',
+        children: [
+          {
+            text: 'SubGroup',
+            children: ['/group/sub/foo.md', '/group/sub/bar.md'],
+          },
+        ],
+      },
+      // 控制元素何时被激活
+      {
+        text: 'Group 2',
+        children: [
+          {
+            text: 'Always active',
+            link: '/',
+            // 该元素将一直处于激活状态
+            activeMatch: '/',
+          },
+          {
+            text: 'Active on /foo/',
+            link: '/not-foo/',
+            // 该元素在当前路由路径是 /foo/ 开头时激活
+            // 支持正则表达式
+            activeMatch: '^/foo/',
+          },
+        ],
+      },
+      */
+
+    ],
+
+    // 侧边栏数组
+    // 所有页面会使用相同的侧边栏
+    /*
+    sidebar: [
+      // SidebarItem
+      {
+        text: 'Foo',
+        link: '/foo/',
+        children: [
+          // SidebarItem
+          {
+            text: 'github',
+            link: 'https://github.com',
+            children: [],
+          },
+          // 字符串 - 页面文件路径
+          '/foo/bar.md',
+        ],
+      },
+      // 字符串 - 页面文件路径
+      '/bar/README.md',
+    ],
+    */
+
+  },
+}

docs/.vuepress/public/css/search.css

@@ -0,0 +1,25 @@
+/* 搜索框样式 */
+:root {
+  --search-input-width: 12rem;
+  --search-result-width: 25rem;
+}
+
+/* 
+
+:root {
+  --search-bg-color: #ffffff;
+  --search-accent-color: #3eaf7c;
+  --search-text-color: #2c3e50;
+  --search-border-color: #eaecef;
+
+  --search-item-text-color: #5d81a5;
+  --search-item-focus-bg-color: #f3f4f5;
+
+  --search-input-width: 8rem;
+  --search-result-width: 20rem;
+}
+
+body {
+  background: black;
+}
+ */