在线安装
在线升级，纵享丝滑
实战-全网最美博客-teek(知识库&博客二合一)-在线安装-2025.4.1(测试成功)❤️（推荐）
目录
[toc]
前言
提示
你想3秒拥有一个全网最美博客吗？
如果你按我的文档步骤一步步去做，肯定是可以部署成功的。那么你就会和我一样立刻拥有一个属于自己的漂亮网站。😘（如果有问题，请加我微信可友情帮你解惑。）
成果
版权
提示
《Youbg Kbt》大佬开源的《vitepress-theme-teek》一个博客项目（知识库+博客 二合一），它是一个轻量、简易的VitePress主题框架，非常简约唯美，且也在持续迭代更新，感谢大佬开源的这款优秀产品，大佬威武。💖💖💖
这里仅作为自己使用文档记录，具体信息请访问作者官方仓库，或者点击公告进微信群和作者交流。
快速开始✅
如果你不想这么麻烦折腾这些安装步骤，那么可以直接拉取我的开源库，直接开箱即用，只要3秒你就能立马拥有一个和我一样的完美博客网站😜。
bash
cd/d/#来到自己电脑d盘gitclonegit@gitee.com:onlyonexl/vitepress-theme-teek-online-install-one-public.gitcd/d/vitepress-theme-teek-online-install-one-publicpnpmipnpmdocs:dev#本地运行pnpmdocs:build#打包
当然，你可以选择按我的文档一步步去做部署，这样也挺好，可以更加熟悉下这个项目。😜
1、安装
1.安装vitepress
（1）在自己电脑 d盘 创建一个存放vitepress的目录：vitepress-theme-teek-online-install-one-private（名称无所谓，自己定义就好）
bash
cd/d/mkdirvitepress-theme-teek-online-install-one-privatecd/d/vitepress-theme-teek-online-install-one-private（2）安装vitepress
bash
pnpmadd-Dvitepress（3）快速初始化
bash
pnpmvitepressinit记得选择在./docs目录下，其他步骤默认就好。
2.安装teek主题包
bash
pnpminstallvitepress-theme-teek@1.0.0-alpha.3-D#这里去作者github仓库找到最新版本安装就好2、配置
1.引入teek主题
- 作者文档配置
根据 Vitepress 的要求，需要在 .vitepress/theme/index.ts文件中引入 Teek 主题。如果没有该路径，需要先创建它。（这里直接创建即可）
自己本次路径为：docs\.vitepress\theme\index.ts，创建相应目录及文件，然后写入如下代码
ts
importTeek from"vitepress-theme-teek";import"vitepress-theme-teek/index.css";exportdefault{extends:Teek,};警告
确保这个文件和作者仓库最新配置保持一致（可以利用vscode做下对比）；
- 自己本次实际配置
警告
我直接把这个docs\.vitepress\theme目录给拷贝过来了，且复制过来后，要取消下docs\.vitepress\theme\index.ts如下一行注释（原来默认是被注释的）。（其它的功能根据自己需求选择开启，建议直接拷贝我的代码就好）
docs\.vitepress\theme\index.ts详细代码：（请直接拷贝我的代码）
ts
import{defineComponent,h,nextTick,provide,watch } from"vue";import{useData,useRoute } from"vitepress";importTeek,{artalkSymbol,giscusSymbol,walineSymbol } from"vitepress-theme-teek";import"vitepress-theme-teek/index.css";importNoticeContent from"./components/NoticeContent.vue";importBannerImgArrow from"./components/BannerImgArrow.vue";import"vitepress-theme-teek/vp-plus/code-block-mobile.scss";import"vitepress-theme-teek/vp-plus/sidebar.scss";import"vitepress-theme-teek/vp-plus/nav.scss";import"vitepress-theme-teek/vp-plus/nav-blur.scss";import"vitepress-theme-teek/vp-plus/aside.scss";import"vitepress-theme-teek/vp-plus/doc-h1-gradient.scss";import"vitepress-theme-teek/vp-plus/mark.scss";import"vitepress-theme-teek/vp-plus/container.scss";import"vitepress-theme-teek/vp-plus/container-left.scss";import"vitepress-theme-teek/vp-plus/blockquote.scss";import"vitepress-theme-teek/vp-plus/index-rainbow.scss";import"vitepress-theme-teek/tk-plus/banner-desc-gradient.scss";import"vitepress-theme-teek/tk-plus/banner-full-img-scale.scss";import"./styles/index.scss";import{useFooterRuntime } from"./helper/useFooterRuntime";importconfetti from"./components/Confetti.vue";import"vitepress-markdown-timeline/dist/theme/index.css";import"virtual:group-icons.css";import{init } from"@waline/client";import"@waline/client/style";importGiscus from"@giscus/vue";import"artalk/Artalk.css";importArtalk from"artalk";exportdefault{extends:Teek,enhanceApp({app}) {app.component("confetti",confetti);},Layout:defineComponent({name:"LayoutProvider",setup() {const{frontmatter,isDark,page} =useData();const{start,stop} =useFooterRuntime();constroute=useRoute();provide(walineSymbol,(options,el) =>init({serverURL:options.serverURL!,dark:options.dark,el }));provide(giscusSymbol,() =>Giscus);provide(artalkSymbol,(options,el) =>Artalk.init({el,darkMode:isDark.value,pageKey:route.path,pageTitle:page.value.title,server:options.server,site:options.site,}));watch(frontmatter,() =>{nextTick(() =>{if(frontmatter.value.layout ==="home") start();elsestop();});},{immediate:true});return() =>h(Teek.Layout,null,{"teek-notice-content":() =>h(NoticeContent),"teek-home-banner-feature-after":() =>h(BannerImgArrow),});},}),};2.编辑config.mts
拷贝作者原仓库demo\docs-base\.vitepress\config.mts文件到docs\.vitepress目录下
警告
确保这个文件和作者仓库最新配置保持一致（可以利用vscode做下对比）；
- 自己当前config.mts文件内容
docs\.vitepress\config.mts详细代码：（请直接拷贝我的代码）
ts
import{defineConfig } from"vitepress";import{defineTeekConfig } from"vitepress-theme-teek/config";importtimeline from"vitepress-markdown-timeline";import{groupIconMdPlugin,groupIconVitePlugin } from"vitepress-plugin-group-icons";constdescription=["Hd Security 使用文档","认证框架"].toString();consttkConfig=defineTeekConfig({author:{name:"One",link:"https:blogger:{avatar:"/img/xyy-touxiang.png",avatarStyle:"full",name:"One",slogan:"明心静性，爱自己",},docAnalysis:{createTime:"2021-10-19",statistics:{provider:"busuanzi",},wordCount:true,readingTime:true,overrideInfo:[{key:"lastActiveTime",value:(_,currentValue) =>`${currentValue}前`},{key:"totalPosts",label:"文章总数目"},],appendInfo:[{key:"index",label:"序号",value:"One"}],},banner:{mask:false,enabled:true,bgStyle:"fullImg",imgInterval:8000,imgShuffle:true,imgSrc:["/img/bg/1.webp","/img/bg/2.webp","/img/bg/3.webp","/img/bg/4.webp","/img/bg/5.webp","/img/bg/6.webp","/img/bg/7.webp","/img/bg/8.webp","/img/bg/9.webp","/img/bg/10.webp","/img/bg/11.webp","/img/bg/12.webp","/img/bg/13.webp","/img/bg/14.webp","/img/bg/15.webp","/img/bg/16.webp","/img/bg/17.webp","/img/bg/18.webp","/img/bg/19.webp",],descStyle:"types",maskBg:"rgba(0,0,0,0.4)",textColor:"#ffffff",titleFontSize:"3.2rem",descFontSize:"1.4rem",description:["初闻不知曲中意，再听已是曲中人","万般努力只为出人头地，低头弯腰只为爬的更高","无论你在哪里，我一定会找到你 —— 星际牛仔","重要的不是你长得漂亮与否，而是你的心灵是否美丽 —— 千与千寻","我们仰望着同一片天空，却看着不同的地方 —— 秒速五厘米","比自己的生命更重要的东西永远存在着 —— fate","正因为生来什么都没有，因此我们能拥有一切 —— 游戏人生","喜欢一个人就是在对方的一切都合理化","爱，其实很简单，困难的是接受这份简单","最好的爱情是互相成就，而不是互相禁锢","缘分就是，遇见了可以让你笑的人","爱情不是占有，而是彼此成就","生命中最困难的时刻，恰是转机的开始","没有人可以回到过去，但每个人都可以从现在开始","与其等待机会，不如创造机会","生活不会因为你的懦弱而停止脚步","成长的过程总是孤独的，但结果是美好的","即使是在最深的黑暗里，也要保持希望 —— 进击的巨人","不要为了别人而活，要为了自己而活 —— 火影忍者","比起悲伤，无法分享快乐才是真的寂寞 —— 四月是你的谎言","梦想是不会结束的，只要还活着就要继续追逐 —— 海贼王","生命的意义不在于活了多久，而在于经历了什么","最珍贵的不是拥有的回忆，而是正在创造的回忆","不要因为走得太远，而忘记了为什么出发","有时候，坚持了你最不想干的事情，却等来了你最想要的结果","与其用泪水悔恨昨天，不如用汗水拼搏今天","每个人都是自己人生的主角","不要被周围的声音干扰，坚持自己认定的道路","成功不是终点，失败也不是终结","时间会证明一切，耐心是最好的答案","活在当下，珍惜现在，期待未来",],switchTime:4000,switchShuffle:false,typesInTime:200,typesOutTime:100,typesNextTime:800,typesShuffle:false,},wallpaper:{enabled:true,},post:{coverImgMode:"full",},article:{showIcon:true,dateFormat:"yyyy-MM-dd",showInfo:true,showAuthor:true,showCreateDate:true,showUpdateDate:true,showCategory:true,showTag:true,topTip:frontmatter=>{consttip:Record<string,string>={type:"warning",title:"注意",text:"文章发布较早，内容可能过时，阅读注意甄别。",};if(frontmatter.long) returntip;constlongTime=6*30*24*60*60*1000;if(frontmatter.date &&Date.now() -newDate(frontmatter.date).getTime() >longTime) returntip;},},friendLink:{list:[{avatar:"/img/friends/Kbt.png",name:"Young Kbt blog",desc:"teek作者",link:"https:{avatar:"/teeker-logo-large.png",name:"vitepress-theme-teek",desc:"teek官网",link:"https:{avatar:"/img/friends/hyde-logo.ico",name:"Hyde Blog",desc:"前端大佬,666",link:"https:{avatar:"/img/friends/eryajiangfan.png",name:"二丫讲梵",desc:"Teeker道友",link:"https:],},footerInfo:{bottomMessage:["初闻不知曲中意，再听已是曲中人"],theme:{show:true,name:"Theme By teek@2023.3.31-1.0.0-alpha.3",link:"https:},copyright:{show:true,createYear:2024,suffix:"One",},icpRecord:{name:"陇ICP备2023002645号",link:"http:},securityRecord:{name:"甘公网安备62102702000211号",link:"https:},customHtml:`<p>小破站已运行了 <span id="footer-runtime"></span></p>`,},social:[{icon:"icon-github",iconType:"iconfont",name:"GitHub",link:"https:},{icon:"icon-gitee2",iconType:"iconfont",name:"Gitee",link:"https:},{icon:"icon-qq",iconType:"iconfont",name:"QQ",link:"http:},{icon:"icon-mobile",iconType:"iconfont",name:"联系我",link:"https:},],comment:{provider:"twikoo",options:{envId:"https:link:"https:},},notice:{enabled:true,position:"center",},vitePlugins:{autoFrontmatter:true,sidebarOption:{collapsed:true,},},markdown:{config:md=>{md.use(timeline);md.use(groupIconMdPlugin);},},});exportdefaultdefineConfig({ignoreDeadLinks:true,extends:tkConfig,base:"/",title:"One",description:description,cleanUrls:true,lastUpdated:true,lang:"zh-CN",head:[["meta",{name:"author",content:"Tianke"}],["meta",{name:"viewport",content:"width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no",},],["meta",{name:"description",description,},],["meta",{name:"keywords",description }],["link",{rel:"icon",href:"/favicon.ico",type:"image/png"}],["link",{rel:"stylesheet",href:"['script',{src:'https:],markdown:{lineNumbers:true,image:{lazyLoading:true,},container:{tipLabel:"提示",warningLabel:"警告",dangerLabel:"危险",infoLabel:"信息",detailsLabel:"详细信息",},},themeConfig:{logo:"/favicon.ico",darkModeSwitchLabel:"主题",sidebarMenuLabel:"菜单",returnToTopLabel:"返回顶部",lastUpdatedText:"上次更新时间",outline:{level:[2,4],label:"本页导航",},docFooter:{prev:"上一页",next:"下一页",},nav:[{text:'🏡首页',items:[{text:'首页',link:'/'},{text:'起始页',link:'/'},],},{text:'🗃️笔记',items:[{text:'运维',link:'/linux'},{text:'前端',link:'/qianduan'},{text:'编程',link:'/code'},],},{text:'💎专题',items:[{text:'📢teek',link:'/teek'},{text:'博客搭建',link:'/blog'},{text:'前端demo',link:'/qianduan-demo'},{text:'nas',link:'/nas'},{text:'脚本',link:'/jiaoben'},{text:'git',link:'/git'},{text:'面试',link:'/mianshi'},{text:'🧰工具',link:'/tools'},{text:'🎨生活',link:'/life'},{text:'👏开源项目',link:'/opensource'},],},{text:'🏓娱乐',items:[{text:'相册',link:'https:{text:'音乐',link:'/music'},{text:'电影',link:'/movie'},],},{text:"💖小屋",link:"/love"},{text:'👏索引',items:[{text:'分类',link:'/categories'},{text:'标签',link:'/tags'},{text:'归档',link:'/archives'},],},{text:'🍷关于',items:[{text:'关于我',link:'/about-me'},{text:'关于本站',link:'/about-website'},{text:"👂留言区",link:"/liuyanqu"},{text:"💡思考",link:"/thinking"},{text:'👀时间轴',items:[{text:'it圈',link:'/it-quan'},{text:'生活圈',link:'/life-quan'},],},{text:'🤝友链',link:'/youlian'},{text:'🌐网页导航',link:'/websites'},{text:'🔄更新日志',link:'/OneBlog-update-log'},],},],socialLinks:[{icon:"github",link:"https:search:{provider:"local",},},vite:{server:{open:true},plugins:[groupIconVitePlugin(),],build:{chunkSizeWarningLimit:35000,},},});3.安装依赖
bash
cd/d/vitepress-theme-teek-online-install-one-privatepnpmadd-Dsasspnpmadd-Dvitepress-markdown-timelinepnpmadd-Dvitepress-plugin-group-iconspnpmadd-Dcanvas-confetti#安装五彩纸屑pnpminstallvue@waline/client@giscus/vueartalk-D4.拷贝数据
(1)拷贝作者原仓库demo\docs-base\目录下 public目录及index.md 到当前docs路径下
警告
为了最终效果能得到一个完美展现，这里的public目录及index.md请直接使用我gitee仓库里的相关文件：
（2）将自己原来的md文档（自己笔记数据）拷贝到docs目录下，删除其它无关文件：
警告
为了最终效果能得到一个完美展现，这里的md文档（自己笔记数据）请直接使用我gitee仓库里的相关文件：
（3）拷贝作者原仓库docs/examples目录到当前仓库docs\目录（当然从我开源库拷贝也行的）
5.修改package.json文件
- 修改
package.json文件"docs:build"内容如下
警告
修改这里的原因是为了防止自己以后md较多，导致build报错。
bash
"docs:build":"node --max-old-space-size=28672 node_modules/vitepress/bin/vitepress.js build docs",
3、运行
- 来到项目根目录，运行：
bash
pnpmdocs:dev- 打包验证
bash
pnpmdcos:build如果能成功打包的话，那就说明OK了。
- 验证
浏览器打开http:pnpmvitepressinitpnpminstallvitepress-theme-teek@latest-D
（3）拷贝数据
用原仓库根目录下docs目录直接替换我们的docs目录即可（再把docs目录下package.json文件移出到根目录下）
（4）安装依赖
bash
pnpmadd-Dsass-embedded（5）取消注释
关于我
我的博客主旨：
- 排版美观，语言精炼；
- 文档即手册，步骤明细，拒绝埋坑，提供源码；
- 本人实战文档都是亲测成功的，各位小伙伴在实际操作过程中如有什么疑问，可随时联系本人帮您解决问题，让我们一起进步！
🍀 个人网站
🍀 微信二维码
x2675263825 （舍得）， qq：2675263825。
🍀 微信公众号
《云原生架构师实战》
🍀 csdn