Teek~全网最美博客

Teek~全网最美博客

(知识库&博客二合一)

image-20250331130359871

目录

[[toc]]

简介

Teek 是一个基于 Vitepress 构建的主题，是在默认主题的基础上进行拓展，支持 Vitepress 的所有功能、配置，可以零成本迁移过来。

使用本主题可以很方便的搭建一个结构化的知识库或博客。

::: warning

• Node.js 18.0.0 及以上版本
• 在使用本主题前，要求至少会 Vitepress 的基本使用和默认主题的基本配置，然后再查看本文档
• 本文档仅负责介绍 Teek 主题对 Vitepress 默认主题的扩展部分，更多配置请移步 VitePress 中文文档

:::

---

🍊 特性

知识管理

包含三种典型的知识管理形态：结构化、碎片化、体系化。轻松打造属于你自己的知识管理平台。

结构化 && 体系化

自动生成侧边栏、目录页、索引页、面包屑等，轻松构建一个结构化知识库。

碎片化 & 个性化

博客功能提供快速构建知识的碎片化形态，并提供大量个性化的主题配置。

文档风 & 博客风

支持通过配置随意切换文档风和博客风，支持个人博客、文档站、知识库等场景。

---

🍊 拓展功能

相较于 Vitepress 主题，Teek 主要实现了博客风格的功能，部分功能也兼容文档风格，您现在正在阅读的是 Teek 的文档风格。

全局

• 侧边栏自动生成，根据目录自动生成侧边栏，无需手动配置
• 提供目录页，根据 Markdown 文件路径自动生成目录
• 自动生成 frontmatter，并且支持拓展 frontmatter 格式
• 自动生成一级标题
• 全站背景图片
• 自定义布局：分类页、标签页、归档页
• Markdown 拓展：居中、居右容器、卡片容器、Demo 容器、TODO 列表、Video 容器
• 主题多元化：4 种主题尺寸、8 种主题风格选择，且支持自定义扩展新的尺寸和模式
• …

首页

• Banner 功能：提供 3 种风格选择：局部背景色、局部图片、全屏图片，提供打印个性签名、切换个性签名选择，提供 feature 功能
• 文章列表：展示文章标题、封面图、作者、创建时间、更新时间、标签、分类
• 博客卡片栏：博主信息栏、精选文章栏、分类栏、标签栏、友情链接栏、站点信息栏
• 全屏壁纸模式：只保留 Banner 背景图片或全站背景图片，且禁止滚动、打开开发者工具、右键功能
• 页脚：展示社交图标、版权信息、备案信息、自定义信息
• …

文章页

• 文章信息：展示面包屑、作者、创建时间、更新时间、标签、分类、字数、阅读时长
• 评论区：提供 Giscus、Twikoo、Waline、Artalk 四种评论提供商选择，并且支持自定义评论区
• 代码块：UI 升级，支持一键折叠/展开
• 文章页风格书页化：提供 3 种风格选择：Vitepress 原生、整体卡片化、片段卡片化
• …

除了上述功能，Teek 也提供了 CSS 文件来增强 Vitepress 的样式。

版权

::: warning

此《vitepress-theme-teek 》项目是《Young Kbt blog》大佬开源的，感谢大佬开发的优秀主题，大佬威武，这里仅记录下个人日常使用teek的一些信息，关于项目具体信息，可访问其官网，多些。❤️❤️

:::

• 官方demo及文档说明

https://vp.teek.top/

image-20250417062350651

• 仓库

https://github.com/Kele-Bingtang/vitepress-theme-teek

image-20250226181606423

开箱即用版

开箱即用版~Teek-one💖 介绍

::: tip

自己开源的 《vitepress-theme-teek-one-public》网站模板。

此模板是在《Young Kbt blog》大佬开源项目《vitepress-theme-teek 》基础上修改为自己的风格而成，感谢大佬开发得主题，大佬威武。❤️❤️

:::

image-20250411074219170

https://onedayxyy.cn/ （我的网站效果）

image-20250331130359871

特色

此开源版本相对于原作者原始版新增如下功能：

1. 新增 字体加粗颜色为红色；（和typora-theme-one主题保持一致）
2. 新增 引用背景色为紫色且为圆角；（和typora-theme-one主题保持一致）
3. 新增 首页卡片文章鼠标悬停时具有蓝色阴影效果；
4. 新增 鼠标好看的风格；
5. 新增 好看的中文字体；
6. 新增 网页侧边栏音乐播放器；
7. 新增 看板娘；
8. 新增 时间线；
9. 新增 五彩纸屑；
10. 自定义404页面；
11. 顶部进度条
12. 网页切换文字效果
13. Umami统计

部署💖

cd /d/ #来到自己电脑d盘
git clone git@gitee.com:onlyonexl/vitepress-theme-teek-online-install-one-public.git

cd /d/vitepress-theme-teek-online-install-one-public
pnpm i
pnpm docs:dev #本地运行

pnpm docs:build #打包

升级

一条命令就可以完成在线升级，特别丝滑哦。

pnpm add vitepress-theme-teek@latest -D

日志

Teek-one更新日志:

::: timeline 2025-04-28

• 增加umami网站统计

:::

::: timeline 2025-04-24

• 新增网页标题切换 & 看板娘风格更换 & 顶部滚动条 & 修复回到顶部失效问题 & 字体优化

:::

::: timeline 2025-04-22

• 移除首页右上角音乐播放器

:::

::: timeline 2025-04-11

• 发布Teek-one@release-v1.0.0 （此版本已完全满足个人博客日常使用，足够丝滑，强烈推荐。）

:::

---

🍊 扩展：官方更新日志

https://github.com/Kele-Bingtang/vitepress-theme-teek/blob/dev/CHANGELOG.md

image-20250407224050167

计划

1. 重点优化 "知识库+博客 风格博客功能
2. 添加一些其他主题有趣的元素到Teek里
3. 优化Teek性能
4. 希望有更多大佬能参与到这个项目，贡献自己一份力量
5. 选一些好看的壁纸(风景/妹纸/动漫等)

反馈

在使用过程中有任何问题和想法，请给作者提 Issue。 你也可以在 Issue 查看别人提的问题和给出解决方案。

或者加入我们的交流群（添加我的微信并备注 进群）：

image-20230107215114763

关于我

我的博客主旨：

• 排版美观，语言精炼；
• 文档即手册，步骤明细，拒绝埋坑，提供源码；
• 本人实战文档都是亲测成功的，各位小伙伴在实际操作过程中如有什么疑问，可随时联系本人帮您解决问题，让我们一起进步！

🍀 [个人网站]()

image-20250109220325748

🍀 微信二维码

x2675263825 （舍得）， qq：2675263825。

image-20230107215114763

🍀 微信公众号

《云原生架构师实战》

image-20230107215126971

🍀 csdn

https://blog.csdn.net/weixin_39246554?spm=1010.2135.3001.5421

image-20230107215149885

🍀 知乎

https://www.zhihu.com/people/foryouone

image-20230107215203185

最后

如果你还有疑惑，可以去我的网站查看更多内容或者联系我帮忙查看。

• One(opens new window)

如果你有更好的方式，评论区留言告诉我。谢谢！

好了，本次就到这里了，感谢大家阅读，最后祝大家生活快乐，每天都过的有意义哦，我们下期见！