在上一篇文章《我要搭建一个文档网站遇到的困难以及感悟》不是说，最近要搭建一个文档类型的网站嘛，现在可以说是捣鼓成了哈。

当然利用的还是Vitepress搭建，看看效果哈：https://docs.yeqi.net

现在回忆一下自己搭建所踩的各种坑，当时搭建的时候没来得及记录，现在回忆一下，能想起来多少就写多少吧。

说说我搭建文档所踩的坑吧

  • 第一坑：标点符号没写或者写的不对
  • 第二坑：代码放错地方了
  • 第三坑：导航栏和侧边栏傻傻分不清

标点符号没写或者写的不对

第一句话就是要说自己了，吃了没文化的亏，

当然报错的原因各不相同。

,这个标点符号有的地方忘记写上了，比如在代码结尾的} 后面忘了写,,还有的,我使用的是中文输入法输入的，。

1
2
3
4
5
6
7
8
sidebar: [
      {
        text: 'Examples',
        items: [
          { text: 'Markdown Examples', link: '/markdown-examples' },
          { text: 'Runtime API Examples', link: '/api-examples' }
        ]
      }

正确的代码应该是：

1
2
3
4
5
6
7
8
sidebar: [
      {
        text: 'Examples',
        items: [
          { text: 'Markdown Examples', link: '/markdown-examples' },
          { text: 'Runtime API Examples', link: '/api-examples' },
        ]
      },

就因为这个符号，我找了半夜的原因，这个绝对是记忆深刻。

代码放错地方了

比如这段代码：

1
2
3
4
5
6
export default defineConfig({
  lang: 'zh-CN',
  title: "VitePress",
  description: "我的vitpress文档教程",
  titleTemplate: '另起标题覆盖title' ,
})

正确的写法应该是上面的写法，但是我的粘贴的时候没注意给弄成这个样子了，请看下面的演示代码

1
2
3
4
5
6
export default defineConfig({
  lang: 'zh-CN',
  title: "VitePress",
   description: "我的vitpress文档教程",
  titleTemplate: '另起标题覆盖title' ,
})

description: "我的vitpress文档教程"这行代码没和上面的title: "VitePress"上下对齐，所以造成一些不必要的麻烦，后来重新又在本地其他的文件夹里安装了一个VitePress，简直被自己给蠢哭了！😂😂😂😂😂😂

导航栏和侧边栏傻傻分不清

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
import { defineConfig } from 'vitepress'

// https://vitepress.dev/reference/site-config
export default defineConfig({
  title: "夜七笔记",
  description: "我的vitpress文档教程",
  themeConfig: {
    // https://vitepress.dev/reference/default-theme-config
    nav: [
      { text: 'Home', link: '/' },
      { text: 'Examples', link: '/markdown-examples' }
    ],

    sidebar: [
      {
        text: 'Examples',
        items: [
          { text: 'Markdown Examples', link: '/markdown-examples' },
          { text: 'Runtime API Examples', link: '/api-examples' }
        ]
      }
    ],

    socialLinks: [
      { icon: 'github', link: 'https://github.com/vuejs/vitepress' }
    ]
  }
})

一直分不清出nav下面的代码和sidebar下面的代码，我一直以为他俩不管修改哪一个都是导航栏呢！又一次被自己蠢哭了，还是吃了没知识的亏！

总结

先写这么多吧，反正我自己知道，脑子里没那么多的知识，还有很多坑等着我呢！

给自己加油吧。