[{"data":1,"prerenderedAt":175},["ShallowReactive",2],{"\u002Fpost\u002F2024\u002Frelease-tripper-nuxt":3,"post-alt:\u002Fpost\u002F2024\u002Frelease-tripper-nuxt":174},{"id":4,"title":5,"body":6,"category":159,"cover":160,"date":161,"description":162,"excerpt":163,"extension":164,"lang":165,"meta":166,"navigation":168,"path":169,"seo":170,"stem":171,"tags":163,"translationKey":163,"type":172,"__hash__":173},"post\u002Fpost\u002F2024\u002Frelease-tripper-nuxt.md","宣布 Tripper Press @ Nuxt",{"type":7,"value":8,"toc":153},"minimark",[9,14,18,21,28,31,34,37,40,56,59,91,94,97,100,103,107,149],[10,11,13],"h2",{"id":12},"全新-tripper-press基于-nuxt-打造","全新 Tripper Press，基于 Nuxt 打造",[15,16,17],"p",{},"好家伙，Tripper Press 又改版了。",[15,19,20],{},"这次，我使用 Nuxt 重构了整个 Tripper Press 站点。做出这个决定是因为 Next.js 很大程度上依托于 Vercel，然而我的 Vercel 现在已经寄了。",[15,22,23],{},[24,25],"img",{"alt":26,"src":27},"402 PAYMENT_REQUIRED","https:\u002F\u002Fimgur.lzmun.com\u002Ftricms\u002F1718632444912-Snipaste_2024-06-17_21-53-55.png_itp",[15,29,30],{},"自从接入 Sanity 之后，Vercel 的 Edge Requests、Fast Origin Transfer 以及 Bandwidth 等项目用量就大幅飙升，仅 6 月 2 日单日，Tripper-Next 项目的 Fast Origin Transfer 消耗高达 8.57GB，Bandwidth 消耗高达 5.74GB，在过去 30 天中，Fast Origin Transfer 消耗共计 34GB，Bandwidth 消耗 10GB。感觉我的博客应该不会有这么高的访问量，应该是哪里出了问题，也许是 RSS 等爬虫在爬取网站的时候，将图片等静态资源也大量下载，导致了这个问题。",[15,32,33],{},"兜兜转转，最终我又放弃了 CMS + SSR 的方案，转而使用之前静态网站生成器的方案。这次我选择了 Nuxt.js，首先因为不能再使用 Vercel，并且之前用的 Contentlayer 并不支持在 Windows 上运行，加上我最近做的几个小工具都是基于 Nuxt 或者 Vue 的，所以这次就选择了 Nuxt。",[15,35,36],{},"Nuxt 的优势有很多， 即使抛开基于 Vue 所带来优势不谈，Nuxt 的众多官方插件，包括 Nuxt Content、Nuxt Studio 等，绝对是一大优势，事实上，这一篇文章就是在 Nuxt Studio 中敲出来的。",[15,38,39],{},"样式方面，这次我没有用一些带样式的前端框架，只使用了 Tailwind CSS，毕竟是自己的主站，样式方面还是自己设计的比较好。",[15,41,42,43,50,51,55],{},"按照惯例，这次的网站依然在 ",[44,45,49],"a",{"href":46,"rel":47},"https:\u002F\u002Fgithub.com\u002Faiokr\u002FTriPress-Nuxt",[48],"nofollow","aiokr\u002FTriPress-Nuxt"," 上开源，欢迎大家 star，当然在 fork 之后，记得删除仓库内的 Markdown 文件，修改 ",[52,53,54],"code",{},"nuxt.config.js"," 中的一些配置，比如 turnstile 的 siteKey、分析插件的 ID 等。",[15,57,58],{},"在这次改版中，我除了保留了之前版本的一些设计样式之外，还借鉴了不少其他个人站点的创意：",[60,61,62,70,77,84],"ul",{},[63,64,65],"li",{},[44,66,69],{"href":67,"rel":68},"https:\u002F\u002Fhonghong.me\u002F",[48],"Hong - A Full Stack Developer",[63,71,72],{},[44,73,76],{"href":74,"rel":75},"https:\u002F\u002Fdarmau.design\u002F",[48],"可可托海没有海",[63,78,79],{},[44,80,83],{"href":81,"rel":82},"https:\u002F\u002Fcamarts.cn\u002F",[48],"Camarts",[63,85,86],{},[44,87,90],{"href":88,"rel":89},"https:\u002F\u002Fblog.maximeheckel.com\u002F",[48],"Maxime Heckel's Blog",[10,92,93],{"id":93},"内容",[15,95,96],{},"个人站点，技术方面还是次要的，更难实现的是如何在站点上介绍自己。我决定不再使用常见的个人网站中那种，在首页列出所有文章，然后另外再有一个专门的关于页面来介绍站点和作者的方式。而是在首页就介绍自己，而文章只展示最新的几篇，所有文章列表则有一个专门的页面。",[15,98,99],{},"Tripper Press 这个站点，是呈现我斜杠人生的一个集合。",[101,102],"hr",{},[10,104,106],{"id":105},"markdown-样式测试","Markdown 样式测试",[108,109,114],"pre",{"className":110,"code":111,"language":112,"meta":113,"style":113},"language-js shiki shiki-themes github-light github-dark","var s = \"JavaScript syntax highlighting\";\nalert(s);\n","js","",[52,115,116,139],{"__ignoreMap":113},[117,118,121,125,129,132,136],"span",{"class":119,"line":120},"line",1,[117,122,124],{"class":123},"szBVR","var",[117,126,128],{"class":127},"sVt8B"," s ",[117,130,131],{"class":123},"=",[117,133,135],{"class":134},"sZZnC"," \"JavaScript syntax highlighting\"",[117,137,138],{"class":127},";\n",[117,140,142,146],{"class":119,"line":141},2,[117,143,145],{"class":144},"sScJk","alert",[117,147,148],{"class":127},"(s);\n",[150,151,152],"style",{},"html pre.shiki code .szBVR, html code.shiki .szBVR{--shiki-default:#D73A49;--shiki-dark:#F97583}html pre.shiki code .sVt8B, html code.shiki .sVt8B{--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .sZZnC, html code.shiki .sZZnC{--shiki-default:#032F62;--shiki-dark:#9ECBFF}html pre.shiki code .sScJk, html code.shiki .sScJk{--shiki-default:#6F42C1;--shiki-dark:#B392F0}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"title":113,"searchDepth":154,"depth":154,"links":155},4,[156,157,158],{"id":12,"depth":141,"text":13},{"id":93,"depth":141,"text":93},{"id":105,"depth":141,"text":106},"开发","https:\u002F\u002Fimgur.lzmun.com\u002Ftricms\u002F1712709442394-20230218-web.jpeg_itp","2024-06-30T00:00:00.000Z","又双叒叕重构了，这次是 Nuxt",null,"md","en",{"slug":167},"release-tripper-nuxt",true,"\u002Fpost\u002F2024\u002Frelease-tripper-nuxt",{"title":5,"description":162},"post\u002F2024\u002Frelease-tripper-nuxt","post","Qo5trtRKJtbMmzwqVGWOY_hZUmTPxs6lOaUcMGW35qs",false,1784389914878]