[{"data":1,"prerenderedAt":1177},["ShallowReactive",2],{"article-daily-thoughts":3,"surround-daily-thoughts":83},{"id":4,"title":5,"author":6,"body":7,"category":70,"cover":64,"date":71,"description":72,"extension":73,"meta":74,"navigation":75,"path":76,"published":75,"seo":77,"stem":78,"tags":79,"updated":81,"__hash__":82},"blog\u002Fblog\u002Fdaily-thoughts.md","程序员的日常思考","yunhai",{"type":8,"value":9,"toc":63},"minimark",[10,13,17,21,24,30,33,36,49,52,55,60],[11,12,5],"h1",{"id":5},[14,15,16],"p",{},"写代码久了，总会有一些关于生活的思考。",[18,19,20],"h2",{"id":20},"关于专注",[14,22,23],{},"在这个信息爆炸的时代，保持专注变得越来越困难。但恰恰是深度工作的能力，让我们能够创造出真正有价值的东西。",[25,26,27],"blockquote",{},[14,28,29],{},"并非所有的忙碌都是生产力。",[18,31,32],{"id":32},"关于学习",[14,34,35],{},"技术的更新速度越来越快，但核心的思维方式是不变的。学会学习，比学会某个具体技术更重要。",[37,38,39,43,46],"ul",{},[40,41,42],"li",{},"理解原理而非记忆 API",[40,44,45],{},"动手实践而非只看教程",[40,47,48],{},"教会他人来验证自己的理解",[18,50,51],{"id":51},"关于平衡",[14,53,54],{},"生活不仅仅是代码。阅读、运动、社交，这些看似与技术无关的事情，反而能让我们成为更好的程序员。",[25,56,57],{},[14,58,59],{},"代码之外的世界，同样精彩。",[14,61,62],{},"愿每一位技术人都能找到属于自己的节奏。",{"title":64,"searchDepth":65,"depth":65,"links":66},"",2,[67,68,69],{"id":20,"depth":65,"text":20},{"id":32,"depth":65,"text":32},{"id":51,"depth":65,"text":51},"生活","2025-04-12","关于技术、生活与平衡的一些随笔","md",{},true,"\u002Fblog\u002Fdaily-thoughts",{"title":5,"description":72},"blog\u002Fdaily-thoughts",[80,70],"随笔",null,"NI_LqxObDgGj2ltzPGEhOyylhJtTRBeR3vvRXFZFvfY",[84,140,180,421,466,768,855],{"id":85,"title":86,"author":87,"body":88,"category":70,"cover":64,"date":132,"description":133,"extension":73,"meta":134,"navigation":75,"path":135,"published":75,"seo":136,"stem":137,"tags":138,"updated":81,"__hash__":139},"blog\u002Fblog\u002F2025.4.23.md","放弃幻想，继续斗争","mulin",{"type":8,"value":89,"toc":130},[90,94,100,103,106,109,112,115,118,121,124,127],[11,91,93],{"id":92},"放弃幻想继续斗争关于山海经新时代奋斗征程的论述","放弃幻想，继续斗争（关于山海经新时代奋斗征程的论述）",[14,95,96],{},[97,98,99],"strong",{},"作者：沐霖",[14,101,102],{},"今年的5月1日，是个值得庆祝的日子，它将向后人昭示一个新时代的开始。什么新时代？是党正式走向新的振兴的伟大新时代",[14,104,105],{},"首先指出，党与云海中央接轨后是党的新时代奋斗征程的先决条件，在中央的领导下，我们有能力，有条件实现党的伟大复兴。推动党的伟大复兴，第一个要求就是跟随中央的领导。其次，回顾党的奋斗征程，无非是在历史中选择总结经验，得到实事求是的经验，推进党的伟大复兴，就是在历史当中总结经验并加以创新，这是党的伟大复兴的第二先决条件",[14,107,108],{},"在明确先决条件后，便是党为什么振兴，怎么去振兴？",[14,110,111],{},"党的伟大复兴是党的历史必然趋势。发展至50人不是繁荣顶峰，它是党的新时代奋斗的起点，它证明了党的人数短期快速增长是存在的，它是一片实验田，有了经验，有了基础。党是持久发展的，拥抱活力的法宝，而低迷不去自求突破的，这是片面的，短期的，这是把短期的低迷当做长期看待，这是应当严厉批判的右倾机会主义，固步自封，不求突破，这就是我们党的某些干部的工作态度，第一，他们没有以身作则，第二他们的失败主义会对党的基层成员，干部产生及其不良的影响，是必须严肃处理的",[14,113,114],{},"那末，在新时代的发展下，党又如何去振兴又是我们的问题",[14,116,117],{},"实现党的伟大复兴，无非三个阶段：第一阶段,即从第二届一中全会开始,全面铺开开拓工作,基本完成工业化,以平衡合作为方针构建政治同盟为外交方针,达到掌握左右政治局的目的,完成招收6名骨干,14名普通成员为的开拓指标,直至三届一中全会召开。第二阶段,即从三届一中全会开始,全面军政体系改革,将目前(行政架构划分第4版)的的政治架构全面落实,推动文娱活动的积极开展。至多招收20人,直至我党的第二届中央政治协商会议的召开。第三阶段,即从二次政协会议开始,全面发展开拓工作,直到与中央达到同一发展水平。目前,党处于第一阶段的起步阶段,既然已走向复兴,那么何必畏首畏尾?故而,第一阶段是需要创新与实干的,我们党将要长期处在这个阶段,学习这个阶段,这是党发展的必要时期,也是我们获取经验,补充干部的黄金时期。那末,这是不是代表后两个阶段是没用的呢?不是的。实现振兴,在除了人员的要求之外,还需要健全的政治体制。一个工人,你让他一天造一根针,那是低效的,但你让一群工人,分好职责,分工协作,那可以造出成百上千根针。实现政体改革,本质上是实现解放党的工作效率的解放。还有一些同志便不理解,利用架构这不是限制娱活动吗?不是的,在本质上,两者同样是不冲突的,两者都是使工会具有活力的手段。在这一方面,支部中央认为,积极开展活动,促进体制化的改革。故而,在党的二届一中全会后,党允许各干员,干部可以在不严重违反纪律的情况下组织团建活动,中央予以支持和鼓励,必要时提供物质的帮助。综上所述,党在二阶段的三切改革的是常发展的重要时期，这不仅是党完善行政制度的时期，同时也起到同化一阶段成，的作用。第三阶段,是党实现振兴的收官时期,它将进一步宣告,党的发展两年奋斗已取得巨大成果,党已然进入新的发展时期。",[14,119,120],{},"那末,明确了党的奋斗方向,如何去实现呢?来来去去,无外乎这几个字:创新、务实,勤奋,理想。创新是党进程的根本动力,务实,勤奋,是党进程的前进方式,理想,是党进程的支撑。在组织上，干部，干员要融成一体，要形成干部学干部，干员学干部，干员学干员，干部学干员的大学",[14,122,123],{},"工会是我们的,但也是你们的,并且归根结底是属于你们年轻一代的,希望与未来寄托在你们身上,工会的伟大振兴并非一朝一夕便可以完成的,这就需要你们这一代担起责任,同时也需要我们的开拓。故而,工会的伟大振兴需要全党同志团结奋进,力争上游。",[14,125,126],{},"所有奋战在一线的干员,干部,支部中央号召你们:团结一致,继续前进,放弃幻想,继续斗争。理敢于开拓,敢于创新,切记空谈误事,切记莫要固步自封,实干兴邦,创新前进,为全面推进山海经社会主义联盟新时代复兴征程而努力奋斗!",[14,128,129],{},"2025.4.23",{"title":64,"searchDepth":65,"depth":65,"links":131},[],"2025-04-23","关于山海经新时代奋斗征程的论述",{},"\u002Fblog\u002F2025.4.23",{"title":86,"description":133},"blog\u002F2025.4.23",[80,70],"G9ZCsLecoUuhAIySidp9AI47wM1Q5PYg7jAs1yPp9iE",{"id":141,"title":142,"author":87,"body":143,"category":80,"cover":64,"date":173,"description":81,"extension":73,"meta":174,"navigation":75,"path":175,"published":75,"seo":176,"stem":177,"tags":178,"updated":81,"__hash__":179},"blog\u002Fblog\u002F2026-4-25.md","怎么说，怎么做",{"type":8,"value":144,"toc":171},[145,149,152,155,158,162,165,168],[11,146,148],{"id":147},"怎么说怎么做山海经人民公社外交理论的阐述","怎么说，怎么做（山海经人民公社外交理论的阐述）",[14,150,151],{},"随着党的开拓工作的进行,我们就必须不可避免的面对一系列外交问题,就此,为了解答我们一些同志的疑惑,也是为了日后能系统性的开展官方外交工作,有必要就我们的外交理论进行阐述了。",[14,153,154],{},"党的新时代奋斗征程的开始,同时代表党必须结合实事对现有外理论进行整合。那么,在党开展外交工作前,党需要什么样的条件呢?",[14,156,157],{},"党的外交前提只有两个;这里先说其一,便是党需要强大的综合实力。国防是级的强硬后盾,如果我们没有强大的综合实力下开展外交,那么我们必然丧失主权,失去公开的发言权,这是失败的外交。举一个自身的例子,党在2024年815事变以前对待外交的态度是一在忍让,失去了前期优势,使党的基本形象大为下降,究其原因,便是党在发展层面上的不重视或发展缓慢进而只可退而求其次。同时,无数的历史已然证明,国防才是对外发言的有效论据，“笔杆子外交,”讨嫌,终其是不久远的,唯有抓起枪杆子说话,才是外交的正确说话方式。那末,再说其二,便是党的外交必须以促进自身发展为前提,任何形式的外交,在它的开展目的就是要促进自身发展,以外交手段保障工会正常发展,这是我们开展外交工作的第二个前提。",[11,159,161],{"id":160},"那么我们在当前的开拓工作中又应当如何展开外交工作呢","那么,我们在当前的开拓工作中,又应当如何展开外交工作呢?",[14,163,164],{},"目前阶段,尤其是党的基础工业还没正式开始的情况下,党的外交方向应当以和平手段为主,尽量以和平手段解决外交冲突。故而我们提出对外交往的四项基本原则:坚持长期共存,坚持不涉内政,坚持平等互利,坚持积极对话。长期共存,是指党在对外交往中应始终明白,服务器的建设从不只是一个工会努力的结果,它是全服玩家,政治社团共同努力的结果,坚持长期共存,就是要让服务器的建设者们相互合作建设,促进服务器和平发展。不涉内政,是和平外交下的必然产物,党无意干涉他国方面内政,不颠覆政权,不支持内战的任何一方势力,不激化他国工会内部矛盾,党不干涉他国内政,同时也坚决不允许他国工会干涉内政,内政问题,是党的外交中的绝对红线,关乎我党最根本,最生死攸关的利益问题,故而,任何外交工作者应当树立保守党的内政秘密的意识。平等互利,是党的外交合作的基本目的,互利互惠,相互平等,对我党的推对多边关系交往有重要意义。积极对话,是党一切外交工作的基本手段,通过喊话,对话解决部分事件,积极活跃于政治舞台,这些都是险非武为手段下解决外交争端的方式,对提升我党的政治地位,具有极大的作用。",[14,166,167],{},"周总理在我国的外交部成立大会上说到：“旧中国的外交史，是屈辱的外交史，我们不学他们，我们另起炉灶。”同样的，我们党的外交也必须实事求是，独立自主，敢爱敢恨，这便是我们党的外交工作人员必须学会的东西",[14,169,170],{},"2025.4.25",{"title":64,"searchDepth":65,"depth":65,"links":172},[],"2026-04-25",{},"\u002Fblog\u002F2026-4-25",{"title":142,"description":81},"blog\u002F2026-4-25",[80],"RlBs6IT1xe5fLamjlEZ2RdQ0kGdSHJsaF_p__p8B_6M",{"id":181,"title":182,"author":6,"body":183,"category":410,"cover":64,"date":411,"description":412,"extension":73,"meta":413,"navigation":75,"path":414,"published":75,"seo":415,"stem":416,"tags":417,"updated":81,"__hash__":420},"blog\u002Fblog\u002Fcss-grid-guide.md","CSS Grid 布局完全指南",{"type":8,"value":184,"toc":401},[185,188,191,194,197,286,289,294,297,319,322,325,367,370,373,391,394,397],[11,186,182],{"id":187},"css-grid-布局完全指南",[14,189,190],{},"CSS Grid 是现代 CSS 中最强大的布局系统之一。本文将带你从零掌握它。",[18,192,193],{"id":193},"基础概念",[14,195,196],{},"创建一个 Grid 容器非常简单：",[198,199,203],"pre",{"className":200,"code":201,"language":202,"meta":64,"style":64},"language-css shiki shiki-themes github-light github-dark",".container {\n  display: grid;\n  grid-template-columns: repeat(3, 1fr);\n  gap: 20px;\n}\n","css",[204,205,206,219,234,264,280],"code",{"__ignoreMap":64},[207,208,211,215],"span",{"class":209,"line":210},"line",1,[207,212,214],{"class":213},"sScJk",".container",[207,216,218],{"class":217},"sVt8B"," {\n",[207,220,221,225,228,231],{"class":209,"line":65},[207,222,224],{"class":223},"sj4cs","  display",[207,226,227],{"class":217},": ",[207,229,230],{"class":223},"grid",[207,232,233],{"class":217},";\n",[207,235,237,240,242,245,248,251,254,257,261],{"class":209,"line":236},3,[207,238,239],{"class":223},"  grid-template-columns",[207,241,227],{"class":217},[207,243,244],{"class":223},"repeat",[207,246,247],{"class":217},"(",[207,249,250],{"class":223},"3",[207,252,253],{"class":217},", ",[207,255,256],{"class":223},"1",[207,258,260],{"class":259},"szBVR","fr",[207,262,263],{"class":217},");\n",[207,265,267,270,272,275,278],{"class":209,"line":266},4,[207,268,269],{"class":223},"  gap",[207,271,227],{"class":217},[207,273,274],{"class":223},"20",[207,276,277],{"class":259},"px",[207,279,233],{"class":217},[207,281,283],{"class":209,"line":282},5,[207,284,285],{"class":217},"}\n",[18,287,288],{"id":288},"常用属性",[290,291,293],"h3",{"id":292},"grid-template-columns-rows","grid-template-columns \u002F rows",[14,295,296],{},"定义网格的列和行：",[198,298,300],{"className":200,"code":299,"language":202,"meta":64,"style":64},"grid-template-columns: 200px 1fr 1fr;\ngrid-template-rows: auto 1fr auto;\n",[204,301,302,311],{"__ignoreMap":64},[207,303,304,308],{"class":209,"line":210},[207,305,307],{"class":306},"s9eBZ","grid-template-columns",[207,309,310],{"class":217},": 200px 1fr 1fr;\n",[207,312,313,316],{"class":209,"line":65},[207,314,315],{"class":306},"grid-template-rows",[207,317,318],{"class":217},": auto 1fr auto;\n",[290,320,321],{"id":321},"grid-area",[14,323,324],{},"命名网格区域：",[198,326,328],{"className":200,"code":327,"language":202,"meta":64,"style":64},".container {\n  grid-template-areas:\n    \"header header header\"\n    \"sidebar main main\"\n    \"footer footer footer\";\n}\n",[204,329,330,336,344,350,355,362],{"__ignoreMap":64},[207,331,332,334],{"class":209,"line":210},[207,333,214],{"class":213},[207,335,218],{"class":217},[207,337,338,341],{"class":209,"line":65},[207,339,340],{"class":223},"  grid-template-areas",[207,342,343],{"class":217},":\n",[207,345,346],{"class":209,"line":236},[207,347,349],{"class":348},"sZZnC","    \"header header header\"\n",[207,351,352],{"class":209,"line":266},[207,353,354],{"class":348},"    \"sidebar main main\"\n",[207,356,357,360],{"class":209,"line":282},[207,358,359],{"class":348},"    \"footer footer footer\"",[207,361,233],{"class":217},[207,363,365],{"class":209,"line":364},6,[207,366,285],{"class":217},[18,368,369],{"id":369},"响应式布局",[14,371,372],{},"Grid 天然支持响应式设计：",[198,374,376],{"className":200,"code":375,"language":202,"meta":64,"style":64},"grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));\n",[204,377,378],{"__ignoreMap":64},[207,379,380,382,385,388],{"class":209,"line":210},[207,381,307],{"class":306},[207,383,384],{"class":217},": repeat(",[207,386,387],{"class":306},"auto-fit",[207,389,390],{"class":217},", minmax(300px, 1fr));\n",[18,392,393],{"id":393},"总结",[14,395,396],{},"CSS Grid 让复杂布局变得简单，是现代前端开发不可或缺的技能。",[398,399,400],"style",{},"html pre.shiki code .sScJk, html code.shiki .sScJk{--shiki-default:#6F42C1;--shiki-dark:#B392F0}html pre.shiki code .sVt8B, html code.shiki .sVt8B{--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .sj4cs, html code.shiki .sj4cs{--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .szBVR, html code.shiki .szBVR{--shiki-default:#D73A49;--shiki-dark:#F97583}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);}html pre.shiki code .s9eBZ, html code.shiki .s9eBZ{--shiki-default:#22863A;--shiki-dark:#85E89D}html pre.shiki code .sZZnC, html code.shiki .sZZnC{--shiki-default:#032F62;--shiki-dark:#9ECBFF}",{"title":64,"searchDepth":65,"depth":65,"links":402},[403,404,408,409],{"id":193,"depth":65,"text":193},{"id":288,"depth":65,"text":288,"children":405},[406,407],{"id":292,"depth":236,"text":293},{"id":321,"depth":236,"text":321},{"id":369,"depth":65,"text":369},{"id":393,"depth":65,"text":393},"教程","2025-03-28","从基础到进阶，全面掌握 CSS Grid 布局系统",{},"\u002Fblog\u002Fcss-grid-guide",{"title":182,"description":412},"blog\u002Fcss-grid-guide",[418,419,410],"CSS","前端","hA_2DGp2lshG-F4DcjeYmjdJ6Z-aq7xe6tISrsrswjQ",{"id":4,"title":5,"author":6,"body":422,"category":70,"cover":64,"date":71,"description":72,"extension":73,"meta":463,"navigation":75,"path":76,"published":75,"seo":464,"stem":78,"tags":465,"updated":81,"__hash__":82},{"type":8,"value":423,"toc":458},[424,426,428,430,432,436,438,440,448,450,452,456],[11,425,5],{"id":5},[14,427,16],{},[18,429,20],{"id":20},[14,431,23],{},[25,433,434],{},[14,435,29],{},[18,437,32],{"id":32},[14,439,35],{},[37,441,442,444,446],{},[40,443,42],{},[40,445,45],{},[40,447,48],{},[18,449,51],{"id":51},[14,451,54],{},[25,453,454],{},[14,455,59],{},[14,457,62],{},{"title":64,"searchDepth":65,"depth":65,"links":459},[460,461,462],{"id":20,"depth":65,"text":20},{"id":32,"depth":65,"text":32},{"id":51,"depth":65,"text":51},{},{"title":5,"description":72},[80,70],{"id":467,"title":468,"author":469,"body":470,"category":756,"cover":64,"date":757,"description":758,"extension":73,"meta":759,"navigation":75,"path":760,"published":75,"seo":761,"stem":762,"tags":763,"updated":81,"__hash__":767},"blog\u002Fblog\u002Fgetting-started-with-nuxt4.md","使用 Nuxt 4 构建现代博客","xingchen",{"type":8,"value":471,"toc":747},[472,475,478,482,485,511,514,518,525,602,606,609,681,685,692,739,741,744],[11,473,468],{"id":474},"使用-nuxt-4-构建现代博客",[14,476,477],{},"在这篇文章中，我们将探索如何使用 Nuxt 4 构建一个功能完整的现代博客系统。",[18,479,481],{"id":480},"为什么选择-nuxt-4","为什么选择 Nuxt 4？",[14,483,484],{},"Nuxt 4 带来了许多令人兴奋的新特性：",[37,486,487,493,499,505],{},[40,488,489,492],{},[97,490,491],{},"更好的性能"," - 更快的冷启动和热重载",[40,494,495,498],{},[97,496,497],{},"改进的 DX"," - 更直观的配置和 API",[40,500,501,504],{},[97,502,503],{},"原生 TypeScript"," - 完整的类型支持",[40,506,507,510],{},[97,508,509],{},"SSR\u002FSSG 灵活切换"," - 根据需求选择渲染模式",[18,512,513],{"id":513},"核心功能",[290,515,517],{"id":516},"_1-markdown-内容管理","1. Markdown 内容管理",[14,519,520,521,524],{},"使用 ",[204,522,523],{},"@nuxt\u002Fcontent"," 模块，我们可以轻松地管理 Markdown 格式的文章：",[198,526,530],{"className":527,"code":528,"language":529,"meta":64,"style":64},"language-typescript shiki shiki-themes github-light github-dark","const articles = await queryContent('\u002Fblog')\n  .where({ published: { $eq: true } })\n  .sort({ date: -1 })\n  .find()\n","typescript",[204,531,532,557,574,592],{"__ignoreMap":64},[207,533,534,537,540,543,546,549,551,554],{"class":209,"line":210},[207,535,536],{"class":259},"const",[207,538,539],{"class":223}," articles",[207,541,542],{"class":259}," =",[207,544,545],{"class":259}," await",[207,547,548],{"class":213}," queryContent",[207,550,247],{"class":217},[207,552,553],{"class":348},"'\u002Fblog'",[207,555,556],{"class":217},")\n",[207,558,559,562,565,568,571],{"class":209,"line":65},[207,560,561],{"class":217},"  .",[207,563,564],{"class":213},"where",[207,566,567],{"class":217},"({ published: { $eq: ",[207,569,570],{"class":223},"true",[207,572,573],{"class":217}," } })\n",[207,575,576,578,581,584,587,589],{"class":209,"line":236},[207,577,561],{"class":217},[207,579,580],{"class":213},"sort",[207,582,583],{"class":217},"({ date: ",[207,585,586],{"class":259},"-",[207,588,256],{"class":223},[207,590,591],{"class":217}," })\n",[207,593,594,596,599],{"class":209,"line":266},[207,595,561],{"class":217},[207,597,598],{"class":213},"find",[207,600,601],{"class":217},"()\n",[290,603,605],{"id":604},"_2-响应式设计","2. 响应式设计",[14,607,608],{},"结合 TailwindCSS，我们可以快速构建响应式布局：",[198,610,614],{"className":611,"code":612,"language":613,"meta":64,"style":64},"language-html shiki shiki-themes github-light github-dark","\u003Cdiv class=\"grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6\">\n  \u003CArticleCard v-for=\"article in articles\" :key=\"article._id\" :article=\"article\" \u002F>\n\u003C\u002Fdiv>\n","html",[204,615,616,636,672],{"__ignoreMap":64},[207,617,618,621,624,627,630,633],{"class":209,"line":210},[207,619,620],{"class":217},"\u003C",[207,622,623],{"class":306},"div",[207,625,626],{"class":213}," class",[207,628,629],{"class":217},"=",[207,631,632],{"class":348},"\"grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6\"",[207,634,635],{"class":217},">\n",[207,637,638,641,645,648,650,653,656,658,661,664,666,669],{"class":209,"line":65},[207,639,640],{"class":217},"  \u003C",[207,642,644],{"class":643},"s7hpK","ArticleCard",[207,646,647],{"class":213}," v-for",[207,649,629],{"class":217},[207,651,652],{"class":348},"\"article in articles\"",[207,654,655],{"class":213}," :key",[207,657,629],{"class":217},[207,659,660],{"class":348},"\"article._id\"",[207,662,663],{"class":213}," :article",[207,665,629],{"class":217},[207,667,668],{"class":348},"\"article\"",[207,670,671],{"class":217}," \u002F>\n",[207,673,674,677,679],{"class":209,"line":236},[207,675,676],{"class":217},"\u003C\u002F",[207,678,623],{"class":306},[207,680,635],{"class":217},[290,682,684],{"id":683},"_3-暗色模式","3. 暗色模式",[14,686,687,688,691],{},"通过 ",[204,689,690],{},"@nuxtjs\u002Fcolor-mode"," 模块实现暗色模式切换：",[198,693,695],{"className":527,"code":694,"language":529,"meta":64,"style":64},"const colorMode = useColorMode()\ncolorMode.preference = colorMode.value === 'dark' ? 'light' : 'dark'\n",[204,696,697,711],{"__ignoreMap":64},[207,698,699,701,704,706,709],{"class":209,"line":210},[207,700,536],{"class":259},[207,702,703],{"class":223}," colorMode",[207,705,542],{"class":259},[207,707,708],{"class":213}," useColorMode",[207,710,601],{"class":217},[207,712,713,716,718,721,724,727,730,733,736],{"class":209,"line":65},[207,714,715],{"class":217},"colorMode.preference ",[207,717,629],{"class":259},[207,719,720],{"class":217}," colorMode.value ",[207,722,723],{"class":259},"===",[207,725,726],{"class":348}," 'dark'",[207,728,729],{"class":259}," ?",[207,731,732],{"class":348}," 'light'",[207,734,735],{"class":259}," :",[207,737,738],{"class":348}," 'dark'\n",[18,740,393],{"id":393},[14,742,743],{},"Nuxt 4 为现代博客开发提供了强大的基础设施，让我们可以专注于内容创作本身。",[398,745,746],{},"html pre.shiki code .szBVR, html code.shiki .szBVR{--shiki-default:#D73A49;--shiki-dark:#F97583}html pre.shiki code .sj4cs, html code.shiki .sj4cs{--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .sScJk, html code.shiki .sScJk{--shiki-default:#6F42C1;--shiki-dark:#B392F0}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 .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);}html pre.shiki code .s9eBZ, html code.shiki .s9eBZ{--shiki-default:#22863A;--shiki-dark:#85E89D}html pre.shiki code .s7hpK, html code.shiki .s7hpK{--shiki-default:#B31D28;--shiki-default-font-style:italic;--shiki-dark:#FDAEB7;--shiki-dark-font-style:italic}",{"title":64,"searchDepth":65,"depth":65,"links":748},[749,750,755],{"id":480,"depth":65,"text":481},{"id":513,"depth":65,"text":513,"children":751},[752,753,754],{"id":516,"depth":236,"text":517},{"id":604,"depth":236,"text":605},{"id":683,"depth":236,"text":684},{"id":393,"depth":65,"text":393},"技术","2025-04-10","从零开始使用 Nuxt 4、Vue 3 和 TailwindCSS 构建一个现代化的博客系统",{},"\u002Fblog\u002Fgetting-started-with-nuxt4",{"title":468,"description":758},"blog\u002Fgetting-started-with-nuxt4",[764,765,766],"Nuxt","Vue3","TypeScript","8VJSHFDxti_0ZtB3iqW5xqnFj30ZIGVhnmj7T9-9k4U",{"id":769,"title":770,"author":6,"body":771,"category":844,"cover":64,"date":845,"description":846,"extension":73,"meta":847,"navigation":75,"path":848,"published":75,"seo":849,"stem":850,"tags":851,"updated":81,"__hash__":854},"blog\u002Fblog\u002Fhello-world.md","欢迎来到云海-NWUA联合报",{"type":8,"value":772,"toc":840},[773,776,779,782,785,788,799,802,805,832,837],[11,774,770],{"id":775},"欢迎来到云海-nwua联合报",[14,777,778],{},"亲爱的读者们，大家好！",[14,780,781],{},"云海-NWUA联合报正式成立了！这是一个关于技术与创作的博客平台，我们将在这里分享技术文章、生活感悟、教程指南等内容。",[18,783,784],{"id":784},"我们的愿景",[14,786,787],{},"我们希望通过这个平台：",[37,789,790,793,796],{},[40,791,792],{},"📝 分享有价值的技术知识",[40,794,795],{},"🎨 记录创作的灵感与过程",[40,797,798],{},"🌊 与读者一起在知识的云海中探索",[18,800,801],{"id":801},"接下来的计划",[14,803,804],{},"在未来的日子里，我们将持续发布以下类型的内容：",[806,807,808,814,820,826],"ol",{},[40,809,810,813],{},[97,811,812],{},"技术文章"," - 前端、后端、DevOps 等技术领域的深度文章",[40,815,816,819],{},[97,817,818],{},"教程指南"," - 从零开始的手把手教程",[40,821,822,825],{},[97,823,824],{},"生活随笔"," - 技术人的日常与思考",[40,827,828,831],{},[97,829,830],{},"行业资讯"," - 值得关注的技术动态",[25,833,834],{},[14,835,836],{},"\"在云海之上，我们看见更广阔的世界。\"",[14,838,839],{},"感谢你的关注，让我们一起扬帆起航！🚀",{"title":64,"searchDepth":65,"depth":65,"links":841},[842,843],{"id":784,"depth":65,"text":784},{"id":801,"depth":65,"text":801},"资讯","2025-04-01","这是云海-NWUA联合报的第一篇文章，我们正式启航！",{},"\u002Fblog\u002Fhello-world",{"title":770,"description":846},"blog\u002Fhello-world",[852,853],"公告","创刊","rc5Pwhp5nwiSG8hVPJnZ6PPPCfa29UixmPT1HbAZu20",{"id":856,"title":857,"author":87,"body":858,"category":756,"cover":64,"date":1169,"description":1170,"extension":73,"meta":1171,"navigation":75,"path":1172,"published":75,"seo":1173,"stem":1174,"tags":1175,"updated":81,"__hash__":1176},"blog\u002Fblog\u002Ftypescript-advanced-types.md","TypeScript 高级类型技巧",{"type":8,"value":859,"toc":1162},[860,863,866,869,872,962,965,968,1081,1084,1087,1148,1151,1154,1156,1159],[11,861,857],{"id":862},"typescript-高级类型技巧",[14,864,865],{},"TypeScript 的类型系统远比想象中强大。本文将介绍一些实用的高级类型技巧。",[18,867,868],{"id":868},"条件类型",[14,870,871],{},"条件类型让我们可以根据类型条件选择不同的类型：",[198,873,875],{"className":527,"code":874,"language":529,"meta":64,"style":64},"type IsString\u003CT> = T extends string ? true : false\n\ntype A = IsString\u003Cstring> \u002F\u002F true\ntype B = IsString\u003Cnumber> \u002F\u002F false\n",[204,876,877,914,919,941],{"__ignoreMap":64},[207,878,879,882,885,887,890,893,895,898,901,904,906,909,911],{"class":209,"line":210},[207,880,881],{"class":259},"type",[207,883,884],{"class":213}," IsString",[207,886,620],{"class":217},[207,888,889],{"class":213},"T",[207,891,892],{"class":217},"> ",[207,894,629],{"class":259},[207,896,897],{"class":213}," T",[207,899,900],{"class":259}," extends",[207,902,903],{"class":223}," string",[207,905,729],{"class":259},[207,907,908],{"class":223}," true",[207,910,735],{"class":259},[207,912,913],{"class":223}," false\n",[207,915,916],{"class":209,"line":65},[207,917,918],{"emptyLinePlaceholder":75},"\n",[207,920,921,923,926,928,930,932,935,937],{"class":209,"line":236},[207,922,881],{"class":259},[207,924,925],{"class":213}," A",[207,927,542],{"class":259},[207,929,884],{"class":213},[207,931,620],{"class":217},[207,933,934],{"class":223},"string",[207,936,892],{"class":217},[207,938,940],{"class":939},"sJ8bj","\u002F\u002F true\n",[207,942,943,945,948,950,952,954,957,959],{"class":209,"line":266},[207,944,881],{"class":259},[207,946,947],{"class":213}," B",[207,949,542],{"class":259},[207,951,884],{"class":213},[207,953,620],{"class":217},[207,955,956],{"class":223},"number",[207,958,892],{"class":217},[207,960,961],{"class":939},"\u002F\u002F false\n",[18,963,964],{"id":964},"映射类型",[14,966,967],{},"映射类型可以基于已有类型创建新类型：",[198,969,971],{"className":527,"code":970,"language":529,"meta":64,"style":64},"type Readonly\u003CT> = {\n  readonly [P in keyof T]: T[P]\n}\n\ntype Optional\u003CT> = {\n  [P in keyof T]?: T[P]\n}\n",[204,972,973,990,1025,1029,1033,1050,1076],{"__ignoreMap":64},[207,974,975,977,980,982,984,986,988],{"class":209,"line":210},[207,976,881],{"class":259},[207,978,979],{"class":213}," Readonly",[207,981,620],{"class":217},[207,983,889],{"class":213},[207,985,892],{"class":217},[207,987,629],{"class":259},[207,989,218],{"class":217},[207,991,992,995,998,1001,1004,1007,1009,1012,1015,1017,1020,1022],{"class":209,"line":65},[207,993,994],{"class":259},"  readonly",[207,996,997],{"class":217}," [",[207,999,1000],{"class":213},"P",[207,1002,1003],{"class":259}," in",[207,1005,1006],{"class":259}," keyof",[207,1008,897],{"class":213},[207,1010,1011],{"class":217},"]",[207,1013,1014],{"class":259},":",[207,1016,897],{"class":213},[207,1018,1019],{"class":217},"[",[207,1021,1000],{"class":213},[207,1023,1024],{"class":217},"]\n",[207,1026,1027],{"class":209,"line":236},[207,1028,285],{"class":217},[207,1030,1031],{"class":209,"line":266},[207,1032,918],{"emptyLinePlaceholder":75},[207,1034,1035,1037,1040,1042,1044,1046,1048],{"class":209,"line":282},[207,1036,881],{"class":259},[207,1038,1039],{"class":213}," Optional",[207,1041,620],{"class":217},[207,1043,889],{"class":213},[207,1045,892],{"class":217},[207,1047,629],{"class":259},[207,1049,218],{"class":217},[207,1051,1052,1055,1057,1059,1061,1063,1065,1068,1070,1072,1074],{"class":209,"line":364},[207,1053,1054],{"class":217},"  [",[207,1056,1000],{"class":213},[207,1058,1003],{"class":259},[207,1060,1006],{"class":259},[207,1062,897],{"class":213},[207,1064,1011],{"class":217},[207,1066,1067],{"class":259},"?:",[207,1069,897],{"class":213},[207,1071,1019],{"class":217},[207,1073,1000],{"class":213},[207,1075,1024],{"class":217},[207,1077,1079],{"class":209,"line":1078},7,[207,1080,285],{"class":217},[18,1082,1083],{"id":1083},"模板字面量类型",[14,1085,1086],{},"TypeScript 4.1 引入了模板字面量类型：",[198,1088,1090],{"className":527,"code":1089,"language":529,"meta":64,"style":64},"type EventName\u003CT extends string> = `on${Capitalize\u003CT>}`\ntype ClickEvent = EventName\u003C'click'> \u002F\u002F 'onClick'\n",[204,1091,1092,1127],{"__ignoreMap":64},[207,1093,1094,1096,1099,1101,1103,1105,1107,1109,1111,1114,1117,1119,1121,1124],{"class":209,"line":210},[207,1095,881],{"class":259},[207,1097,1098],{"class":213}," EventName",[207,1100,620],{"class":217},[207,1102,889],{"class":213},[207,1104,900],{"class":259},[207,1106,903],{"class":223},[207,1108,892],{"class":217},[207,1110,629],{"class":259},[207,1112,1113],{"class":348}," `on${",[207,1115,1116],{"class":213},"Capitalize",[207,1118,620],{"class":348},[207,1120,889],{"class":213},[207,1122,1123],{"class":348},">",[207,1125,1126],{"class":348},"}`\n",[207,1128,1129,1131,1134,1136,1138,1140,1143,1145],{"class":209,"line":65},[207,1130,881],{"class":259},[207,1132,1133],{"class":213}," ClickEvent",[207,1135,542],{"class":259},[207,1137,1098],{"class":213},[207,1139,620],{"class":217},[207,1141,1142],{"class":348},"'click'",[207,1144,892],{"class":217},[207,1146,1147],{"class":939},"\u002F\u002F 'onClick'\n",[18,1149,1150],{"id":1150},"实战应用",[14,1152,1153],{},"这些高级类型在实际项目中非常有用，特别是在构建类型安全的 API 和工具函数时。",[18,1155,393],{"id":393},[14,1157,1158],{},"掌握 TypeScript 高级类型，可以让我们编写更安全、更具表达力的代码。",[398,1160,1161],{},"html pre.shiki code .szBVR, html code.shiki .szBVR{--shiki-default:#D73A49;--shiki-dark:#F97583}html pre.shiki code .sScJk, html code.shiki .sScJk{--shiki-default:#6F42C1;--shiki-dark:#B392F0}html pre.shiki code .sVt8B, html code.shiki .sVt8B{--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .sj4cs, html code.shiki .sj4cs{--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .sJ8bj, html code.shiki .sJ8bj{--shiki-default:#6A737D;--shiki-dark:#6A737D}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);}html pre.shiki code .sZZnC, html code.shiki .sZZnC{--shiki-default:#032F62;--shiki-dark:#9ECBFF}",{"title":64,"searchDepth":65,"depth":65,"links":1163},[1164,1165,1166,1167,1168],{"id":868,"depth":65,"text":868},{"id":964,"depth":65,"text":964},{"id":1083,"depth":65,"text":1083},{"id":1150,"depth":65,"text":1150},{"id":393,"depth":65,"text":393},"2025-04-15","深入理解 TypeScript 的高级类型系统，掌握条件类型、映射类型等技巧",{},"\u002Fblog\u002Ftypescript-advanced-types",{"title":857,"description":1170},"blog\u002Ftypescript-advanced-types",[766,419],"k7YCJ8VaGJZPRV5Cll9TZpxl6V7XAhysbNSuK8qUw0w",1776577690467]