One

主题

00:00:00
2025-09-242025-09-27博客搭建Teek
1905
9.1m
0

维护数据 ​

维护数据 ​

1.迁移数据 ​

（特别注意🛑）

（1）删除模板中存在的老数据

此时，就可以把模板docs目录下的10.运维、15.前端……65.Teek等 目录都 给删除了，然后把你之前的个人笔记数据给放到Teek的docs目录下，然后按上面提到的方式命名。

image-20250916124457183

（2）创建自己的新数据

例如，我们会创建如下目录结构：（每个目录下有多个子目录或者md）

image-20250916124611304

具体目录结构截图示例：

image-20250916124651754

image-20250916124722161

特别注意：

在把你之前的数据迁移到teek时，这里需要格外注意一个问题。

teek目前使用rewrite模式的autoformatter插件来给md强制注入永久permalink，每个md的permalink格式为/一级前缀/随机uid。

因此，当你想要使用teek的rewrite模式后，这里需要我们提前配置一点东西，后续就可以丝滑使用了：

（3）指定一级前缀规则

编辑docs\.vitepress\config.ts文件：

ts
                  { folderName: "10.运维", prefix: "/linux/$uuid5", removeLevel: 99}, // 清空前缀并且添加前缀使用随机数
                  { folderName: "15.前端", prefix: "/qianduan/$uuid5", removeLevel: 99}, // 清空前缀并且添加前缀使用随机数
                  { folderName: "20.编程", prefix: "/code/$uuid5", removeLevel: 99}, // 清空前缀并且添加前缀使用随机数
                  { folderName: "25.黑客", prefix: "/hacker/$uuid5", removeLevel: 99}, // 清空前缀并且添加前缀使用随机数
                  { folderName: "30.专题", prefix: "/zhuanti/$uuid5", removeLevel: 99}, // 清空前缀并且添加前缀使用随机数
                  { folderName: "35.工具", prefix: "/tools/$uuid5", removeLevel: 99}, // 清空前缀并且添加前缀使用随机数
                  { folderName: "40.生活", prefix: "/life/$uuid5", removeLevel: 99}, // 清空前缀并且添加前缀使用随机数
                  { folderName: "45.精神小屋", prefix: "/love/$uuid5", removeLevel: 99}, // 清空前缀并且添加前缀使用随机数
                  { folderName: "50.娱乐", prefix: "/yule/$uuid5", removeLevel: 99}, // 清空前缀并且添加前缀使用随机数
                  { folderName: "55.兴趣", prefix: "/xingqu/$uuid5", removeLevel: 99}, // 清空前缀并且添加前缀使用随机数
                  { folderName: "60.关于", prefix: "/about/$uuid5", removeLevel: 99}, // 清空前缀并且添加前缀使用随机数
                  { folderName: "65.Teek", prefix: "/teek/$uuid5", removeLevel: 99}, // 清空前缀并且添加前缀使用随机数

image-20250916124836366

即：有多少个一级目录，那么配置文件那里就必须配置多少行，这样每个一级目录下的内容就会出现在同一个侧边栏了。

配置完成后，不管你之前的md是否有permalink，teek的autoformatter插件都会强制注入永久permalink。（先可以用其他少量文档做下测试，没问题后，再迁移自己的个人数据。我这里都是测试没问题的，大家可以放心食用。🤣）

（4）配置导航栏项

你需要做的就是，在docs\.vitepress\ConfigHyde\Nav.ts文件里配置对应的url即可：

这里为了方便管理，每个一级目录下最好存放一个md,其序号可以命名为01. 让其为最优先的一个文件。（导航栏对应的菜单就可以配置对应一级目录下这个文件的permalink就行了。）

详细信息
ts
// nav导航栏配置
import { TeekIcon, VdoingIcon, SSLIcon, BlogIcon } from "./icon/NavIcon";
export const Nav = [
    { text: "🏡首页", link: "/" },





    // 笔记
    {
      text: '📚文档',
      items: [
        {
          text: `
            <div style="display: flex; align-items: center; gap: 4px;">
              <img src="/img/nav/linux.svg" alt="" style="width: 16px; height: 16px;">
              <span>运维</span>
            </div>
            `,
          link: '/linux/linux-index',
        },
        {
          text: `
            <div style="display: flex; align-items: center; gap: 4px;">
              <img src="/img/nav/前端.svg" alt="" style="width: 16px; height: 16px;">
              <span>前端</span>
            </div>
            `,
          link: '/qianduan/qianduan-index',
        },
                {
          text: `
            <div style="display: flex; align-items: center; gap: 4px;">
              <img src="/img/nav/编程.svg" alt="" style="width: 16px; height: 16px;">
              <span>编程</span>
            </div>
            `,
          link: '/code/code-index',
        },
        {
          text: `
            <div style="display: flex; align-items: center; gap: 4px;">
              <img src="/img/nav/黑客.svg" alt="" style="width: 16px; height: 16px;">
              <span>黑客</span>
            </div>
            `,
          link: '/hacker/hacker-index',
        },
      ],
    },  

    // 专题
    {
      text: '🛠️专题',
      items: [
        {
          text: `
            <div style="display: flex; align-items: center; gap: 4px;">
              <img src="/img/nav/teek.svg" alt="" style="width: 16px; height: 16px;">
              <span>Teek</span>
            </div>
            `,
          link: '/teek/teek-blog',
        },        
        {
          text: `
            <div style="display: flex; align-items: center; gap: 4px;">
              <img src="/img/nav/Git.svg" alt="" style="width: 16px; height: 16px;">
              <span>Git</span>
            </div>
            `,
          link: '/zhuanti/git',
        },


        {
          text: `
            <div style="display: flex; align-items: center; gap: 4px;">
              <img src="/img/nav/脚本.svg" alt="" style="width: 16px; height: 16px;">
              <span>脚本</span>
            </div>
            `,
          link: '/zhuanti/jiaoben',
        },
     
      ],
    },  







    // 生活
    {
      text: '🏓生活',
      items: [
        {
          // 分组标题1
          text: '娱乐',
          items: [
            {
              text: `
                <div style="display: flex; align-items: center; gap: 4px;">
                  <img src="/img/nav/相册.svg" alt="" style="width: 16px; height: 16px;">
                  <span>相册</span>
                </div>
                `,
              link: '/yule/photo',
            },
            {
              text: `
                <div style="display: flex; align-items: center; gap: 4px;">
                  <img src="/img/nav/电影.svg" alt="" style="width: 16px; height: 16px;">
                  <span>电影</span>
                </div>
                `,
              link: '/yule/movie',
            },
            {
              text: `
                <div style="display: flex; align-items: center; gap: 4px;">
                  <img src="/img/nav/音乐.svg" alt="" style="width: 16px; height: 16px;">
                  <span>音乐</span>
                </div>
                `,
              link: '/yule/music',
            },
          ],
        },
        {
          // 分组标题2
          text: '小屋',
          items: [
            {
              text: `
                <div style="display: flex; align-items: center; gap: 4px;">
                  <img src="/img/nav/精神小屋.svg" alt="" style="width: 16px; height: 16px;">
                  <span>精神小屋</span>
                </div>
                `,
              link: '/love/inner',
            },
            {
              text: `
                <div style="display: flex; align-items: center; gap: 4px;">
                  <img src="/img/nav/时间管理.svg" alt="" style="width: 16px; height: 16px;">
                  <span>时间管理</span>
                </div>
                `,
              link: '/love/time-plan',
            },
            {
              text: `
                <div style="display: flex; align-items: center; gap: 4px;">
                  <img src="/img/nav/文案.svg" alt="" style="width: 16px; height: 16px;">
                  <span>情感文案</span>
                </div>
                `,
              link: '/love/wenan',
            },
            // { text: "💖情侣空间", link: "https://fxj.onedayxyy.cn/" },
          ],
        },
        // 兴趣
        {
          text: '兴趣',
          items: [
            {
              text: `
                <div style="display: flex; align-items: center; gap: 4px;">
                  <img src="/img/nav/旅行.svg" alt="" style="width: 16px; height: 16px;">
                  <span>旅行</span>
                </div>
                `,
              link: '/xingqu/travel',
            },
            {
              text: `
                <div style="display: flex; align-items: center; gap: 4px;">
                  <img src="/img/nav/读书.svg" alt="" style="width: 16px; height: 16px;">
                  <span>读书</span>
                </div>
                `,
              link: '/xingqu/reading',
            },
          ],
        },  

      ],
    },  


    // // 兴趣
    // {
    //   text: '🎨兴趣',
    //   items: [
    //     {
    //       text: `
    //         <div style="display: flex; align-items: center; gap: 4px;">
    //           <img src="/img/nav/旅行.svg" alt="" style="width: 16px; height: 16px;">
    //           <span>旅行</span>
    //         </div>
    //         `,
    //       link: '/xingqu/travel',
    //     },
    //     {
    //       text: `
    //         <div style="display: flex; align-items: center; gap: 4px;">
    //           <img src="/img/nav/读书.svg" alt="" style="width: 16px; height: 16px;">
    //           <span>读书</span>
    //         </div>
    //         `,
    //       link: '/xingqu/reading',
    //     },
    //   ],
    // },  
    
    
    // 索引
    {
      text: '👏索引',
      items: [
        { text: '📃分类页', link: '/categories' },
        { text: '🔖标签页', link: '/tags' },
        {
          text: `
            <div style="display: flex; align-items: center; gap: 4px;">
              <img src="/img/nav/归档.svg" alt="" style="width: 16px; height: 16px;">
              <span>归档页</span>
            </div>
            `,
          link: '/archives',
        },
        {
          text: `
            <div style="display: flex; align-items: center; gap: 4px;">
              <img src="/img/nav/清单.svg" alt="" style="width: 16px; height: 16px;">
              <span>清单页</span>
            </div>
            `,
          link: '/articleOverview',
        },
        {
          text: `
            <div style="display: flex; align-items: center; gap: 4px;">
              <img src="/img/nav/登录.svg" alt="" style="width: 16px; height: 16px;">
              <span>登录页</span>
            </div>
            `,
          link: '/login',
        },
        {
          text: `
            <div style="display: flex; align-items: center; gap: 4px;">
              <img src="/img/nav/风险提示.svg" alt="" style="width: 16px; height: 16px;">
              <span>风险链接提示页</span>
            </div>
            `,
          link: '/risk-link?target=https://onedayxyy.cn/',
        },
      ],
    },  

    // 关于
    {
      text: '🍷关于',
      items: [
        { text: '👋关于我', link: '/about/me' },
        { text: '🎉关于本站', link: '/about/website' },
        { text: '💖友链', link: '/about/friend-links' },
        { text: '🌐网站导航', link: '/about/websites' },          
        { text: "👂留言区", link: "/about/liuyanqu" },
        { text: "💡思考", link: "/about/thouht" },
        { text: "💡情侣相册", link: "/about/love" },
        {
          text: `
            <div style="display: flex; align-items: center; gap: 4px;">
              <img src="/img/nav/时间轴.svg" alt="" style="width: 16px; height: 16px;">
              <span>时间轴</span>
            </div>
            `,
          link: '/about/time-line',
        },
        { text: "💡朋友圈", link: "/about/pyq" },
        {
          text: `
            <div style="display: flex; align-items: center; gap: 4px;">
              <img src="/img/nav/网站统计.svg" alt="" style="width: 16px; height: 16px;">
              <span>网站统计</span>
            </div>
            `,
          link: 'https://umami.onedayxyy.cn/share/DzS4g85V8JkxsNRk/onedayxyy.cn',
        },
        {
          text: `
            <div style="display: flex; align-items: center; gap: 4px;">
              <img src="/img/nav/站点监控.svg" alt="" style="width: 16px; height: 16px;">
              <span>站点监控</span>
            </div>
            `,
          link: 'https://status.onedayxyy.cn/status/monitor',
        },
        { text: "📌我的云盘", link: "https://zdir.onedayxyy.cn/" },

      ],
    },       
  ]

最后形成的导航栏如下：

image-20250916124940975

2.新增md ​

如果你想要新建一个md，该如何呢？

你只需要在对应目录下，新创建一个md就好，但是注意命名必须类似为 20.中国.md才行（以此为例）。

运行项目后，Teek里的autoformatter插件会自动给注入formater参数（如下截图）（你无需做任何操作）：

运行，然后观察效果：

bash
pnpm docs:dev

image-20250916125332157

最近更新