[{"data":1,"prerenderedAt":478},["ShallowReactive",2],{"home-recent-posts":3},[4,38,104,357],{"id":5,"title":6,"body":7,"date":27,"description":28,"draft":29,"extension":30,"meta":31,"navigation":29,"path":32,"seo":33,"stem":34,"tags":35,"__hash__":37},"blog\u002Fblog\u002Fdraft-example.md","未完成的文章（草稿）",{"type":8,"value":9,"toc":23},"minimark",[10,14],[11,12,13],"h1",{"id":13},"草稿文章",[15,16,17,18,22],"p",{},"这篇文章设置了 ",[19,20,21],"code",{},"draft: true","，生产环境中不会出现在列表页。",{"title":24,"searchDepth":25,"depth":25,"links":26},"",2,[],"2026-05-27","这是一篇草稿，不会在博客列表中显示。",true,"md",{},"\u002Fblog\u002Fdraft-example",{"title":6,"description":28},"blog\u002Fdraft-example",[36],"草稿","JDZn62BILAjRr4MQ0SzyjNY9AF2cIckjDp3mLkywYiw",{"id":39,"title":40,"body":41,"date":93,"description":94,"draft":95,"extension":30,"meta":96,"navigation":29,"path":97,"seo":98,"stem":99,"tags":100,"__hash__":103},"blog\u002Fblog\u002Ffrontend-trends-2026.md","2026 前端开发趋势观察",{"type":8,"value":42,"toc":88},[43,46,49,54,57,61,64,68,76,82],[11,44,40],{"id":45},"_2026-前端开发趋势观察",[15,47,48],{},"站在 2026 年中，前端生态已经相当成熟。以下是我的一些观察。",[50,51,53],"h2",{"id":52},"ssr-框架成为默认选择","SSR 框架成为默认选择",[15,55,56],{},"Nuxt 4 的发布标志着 Vue 生态 SSR 方案的成熟。对于内容型网站，SSG + 预渲染是性能和 SEO 的最佳平衡点。",[50,58,60],{"id":59},"原子化-css-持续流行","原子化 CSS 持续流行",[15,62,63],{},"UnoCSS 和 Tailwind 依然是主流选择。原子化 CSS 在组件化开发中提供了极好的开发体验。",[50,65,67],{"id":66},"ai-辅助开发","AI 辅助开发",[15,69,70,71,75],{},"AI 工具已经深度融入日常开发流程，但",[72,73,74],"strong",{},"架构决策和代码审查","仍然需要开发者的判断。",[77,78,79],"blockquote",{},[15,80,81],{},"工具会变，但对用户体验和代码质量的关注不会变。",[15,83,84,85,87],{},"这篇是草稿示例的反面——它已正式发布。你可以在 frontmatter 中设置 ",[19,86,21],{}," 来隐藏未完成的文章。",{"title":24,"searchDepth":25,"depth":25,"links":89},[90,91,92],{"id":52,"depth":25,"text":53},{"id":59,"depth":25,"text":60},{"id":66,"depth":25,"text":67},"2026-05-25","对 Vue 生态、SSR 框架和 AI 辅助开发的一些个人看法。",false,{},"\u002Fblog\u002Ffrontend-trends-2026",{"title":40,"description":94},"blog\u002Ffrontend-trends-2026",[101,102],"前端","随笔","x--9tMQw15duVGqbsdqw4WdXSHVd7_j_EOH9OI4F6O0",{"id":105,"title":106,"body":107,"date":347,"description":348,"draft":95,"extension":30,"meta":349,"navigation":29,"path":350,"seo":351,"stem":352,"tags":353,"__hash__":356},"blog\u002Fblog\u002Fnuxt-content-guide.md","用 Nuxt Content 搭建 Markdown 博客",{"type":8,"value":108,"toc":342},[109,112,123,127,134,247,250,257,321,324,331,338],[11,110,106],{"id":111},"用-nuxt-content-搭建-markdown-博客",[15,113,114,115,118,119,122],{},"Nuxt Content 让 Markdown 文件变成了一等公民的内容源。只需在 ",[19,116,117],{},"content\u002Fblog\u002F"," 目录下创建 ",[19,120,121],{},".md"," 文件，框架会自动解析 frontmatter 并生成路由。",[50,124,126],{"id":125},"collection-配置","Collection 配置",[15,128,129,130,133],{},"在 ",[19,131,132],{},"content.config.ts"," 中定义 collection：",[135,136,140],"pre",{"className":137,"code":138,"language":139,"meta":24,"style":24},"language-typescript shiki shiki-themes github-light github-dark","defineCollection({\n  type: 'page',\n  source: 'blog\u002F**\u002F*.md',\n  schema: z.object({\n    title: z.string(),\n    date: z.coerce.date(),\n    tags: z.array(z.string()).default([]),\n  }),\n})\n","typescript",[19,141,142,155,167,178,189,201,212,235,241],{"__ignoreMap":24},[143,144,147,151],"span",{"class":145,"line":146},"line",1,[143,148,150],{"class":149},"sScJk","defineCollection",[143,152,154],{"class":153},"sVt8B","({\n",[143,156,157,160,164],{"class":145,"line":25},[143,158,159],{"class":153},"  type: ",[143,161,163],{"class":162},"sZZnC","'page'",[143,165,166],{"class":153},",\n",[143,168,170,173,176],{"class":145,"line":169},3,[143,171,172],{"class":153},"  source: ",[143,174,175],{"class":162},"'blog\u002F**\u002F*.md'",[143,177,166],{"class":153},[143,179,181,184,187],{"class":145,"line":180},4,[143,182,183],{"class":153},"  schema: z.",[143,185,186],{"class":149},"object",[143,188,154],{"class":153},[143,190,192,195,198],{"class":145,"line":191},5,[143,193,194],{"class":153},"    title: z.",[143,196,197],{"class":149},"string",[143,199,200],{"class":153},"(),\n",[143,202,204,207,210],{"class":145,"line":203},6,[143,205,206],{"class":153},"    date: z.coerce.",[143,208,209],{"class":149},"date",[143,211,200],{"class":153},[143,213,215,218,221,224,226,229,232],{"class":145,"line":214},7,[143,216,217],{"class":153},"    tags: z.",[143,219,220],{"class":149},"array",[143,222,223],{"class":153},"(z.",[143,225,197],{"class":149},[143,227,228],{"class":153},"()).",[143,230,231],{"class":149},"default",[143,233,234],{"class":153},"([]),\n",[143,236,238],{"class":145,"line":237},8,[143,239,240],{"class":153},"  }),\n",[143,242,244],{"class":145,"line":243},9,[143,245,246],{"class":153},"})\n",[50,248,249],{"id":249},"查询文章",[15,251,252,253,256],{},"使用 ",[19,254,255],{},"queryCollection"," 获取文章列表：",[135,258,260],{"className":137,"code":259,"language":139,"meta":24,"style":24},"const posts = await queryCollection('blog')\n  .order('date', 'DESC')\n  .all()\n",[19,261,262,290,311],{"__ignoreMap":24},[143,263,264,268,272,275,278,281,284,287],{"class":145,"line":146},[143,265,267],{"class":266},"szBVR","const",[143,269,271],{"class":270},"sj4cs"," posts",[143,273,274],{"class":266}," =",[143,276,277],{"class":266}," await",[143,279,280],{"class":149}," queryCollection",[143,282,283],{"class":153},"(",[143,285,286],{"class":162},"'blog'",[143,288,289],{"class":153},")\n",[143,291,292,295,298,300,303,306,309],{"class":145,"line":25},[143,293,294],{"class":153},"  .",[143,296,297],{"class":149},"order",[143,299,283],{"class":153},[143,301,302],{"class":162},"'date'",[143,304,305],{"class":153},", ",[143,307,308],{"class":162},"'DESC'",[143,310,289],{"class":153},[143,312,313,315,318],{"class":145,"line":169},[143,314,294],{"class":153},[143,316,317],{"class":149},"all",[143,319,320],{"class":153},"()\n",[50,322,323],{"id":323},"渲染内容",[15,325,326,327,330],{},"详情页使用 ",[19,328,329],{},"\u003CContentRenderer>"," 组件即可渲染 Markdown 正文，代码高亮由 Shiki 自动处理。",[15,332,333,334,337],{},"这种方案的优势是：",[72,335,336],{},"零后端、Git 版本管理、构建时预渲染","，非常适合个人博客。",[339,340,341],"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 .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 .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}",{"title":24,"searchDepth":25,"depth":25,"links":343},[344,345,346],{"id":125,"depth":25,"text":126},{"id":249,"depth":25,"text":249},{"id":323,"depth":25,"text":323},"2026-05-22","介绍如何使用 Nuxt Content v3 的 collection 机制管理 Markdown 文章。",{},"\u002Fblog\u002Fnuxt-content-guide",{"title":106,"description":348},"blog\u002Fnuxt-content-guide",[354,355],"Nuxt","Vue","V6IIXFNjKyR0Mz9Nr9-1_dBPoIHU35q1LgEBOhC3b5w",{"id":358,"title":359,"body":360,"date":470,"description":471,"draft":95,"extension":30,"meta":472,"navigation":29,"path":473,"seo":474,"stem":475,"tags":476,"__hash__":477},"blog\u002Fblog\u002Fhello-world.md","Hello World",{"type":8,"value":361,"toc":466},[362,365,376,379,382,395,398,460,463],[11,363,359],{"id":364},"hello-world",[15,366,367,368,371,372,375],{},"欢迎来到我的个人博客！这是使用 ",[72,369,370],{},"Nuxt 4"," 和 ",[72,373,374],{},"Nuxt Content"," 搭建的静态博客站点。",[50,377,378],{"id":378},"为什么写博客",[15,380,381],{},"记录是最好的思考方式。在这里，我会分享：",[383,384,385,389,392],"ul",{},[386,387,388],"li",{},"前端开发经验与技巧",[386,390,391],{},"项目实践中的思考",[386,393,394],{},"偶尔的生活片段",[50,396,397],{"id":397},"技术栈",[135,399,401],{"className":137,"code":400,"language":139,"meta":24,"style":24},"const stack = {\n  framework: 'Nuxt 4',\n  ui: 'Vue 3',\n  content: '@nuxt\u002Fcontent',\n  styling: 'UnoCSS',\n}\n",[19,402,403,415,425,435,445,455],{"__ignoreMap":24},[143,404,405,407,410,412],{"class":145,"line":146},[143,406,267],{"class":266},[143,408,409],{"class":270}," stack",[143,411,274],{"class":266},[143,413,414],{"class":153}," {\n",[143,416,417,420,423],{"class":145,"line":25},[143,418,419],{"class":153},"  framework: ",[143,421,422],{"class":162},"'Nuxt 4'",[143,424,166],{"class":153},[143,426,427,430,433],{"class":145,"line":169},[143,428,429],{"class":153},"  ui: ",[143,431,432],{"class":162},"'Vue 3'",[143,434,166],{"class":153},[143,436,437,440,443],{"class":145,"line":180},[143,438,439],{"class":153},"  content: ",[143,441,442],{"class":162},"'@nuxt\u002Fcontent'",[143,444,166],{"class":153},[143,446,447,450,453],{"class":145,"line":191},[143,448,449],{"class":153},"  styling: ",[143,451,452],{"class":162},"'UnoCSS'",[143,454,166],{"class":153},[143,456,457],{"class":145,"line":203},[143,458,459],{"class":153},"}\n",[15,461,462],{},"感谢来访，期待与你交流！",[339,464,465],{},"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 .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);}",{"title":24,"searchDepth":25,"depth":25,"links":467},[468,469],{"id":378,"depth":25,"text":378},{"id":397,"depth":25,"text":397},"2026-05-20","欢迎来到 Ethan Wang 的个人博客，这是第一篇文章。",{},"\u002Fblog\u002Fhello-world",{"title":359,"description":471},"blog\u002Fhello-world",[102,354],"vBCV7VuAIY8PqROTfMXdRT75-6ZmQo5lConjPB-3Exk",1779933176195]