说说用 nuxt 写了个博客的体验

查看 34|回复 0
作者:yuhangch   
之前一直用的 hugo ,想用 cusdis 作为评论系统,又不想直接加载使用 iframe 加载,之前用过 vue ,就想用 nuxt 写个博客试试水。
hugo 很好,生成快,社区活跃,但用起来总像带着镣铐跳舞:翻文档找 api ,编辑在 IDE 里一片红的 HTML 模板。。。
说说用 nuxt 写博客的体验:一路过关斩将的畅快感。
markdown 渲染
首先,markdown 渲染直接拉出来 nuxt-content 就搞定了 ,之前的 md 几乎一点没改,把 quick start 的例子复制上,连路由带渲染直接齐活了,直接增强了我试水的信心。
文章的目录直接使用 nuxt-content 的 content-list 组件搞定,shortcode 直接用Inline components 平替。
纯属为了体验,也用了 YAML 和 CSV 分别用来存关于页的内容和一个类似说说的内容,也没啥问题。
多语言
用 @nuxtjs/i18n没费太大功夫,不同语言的文章分目录管理,localePath 函数处理了路由,不用各种 if-else,几乎没啥代码量。
暗黑模式
@nuxtjs/color-mode 和 @nuxtjs/tailwindcss 用着也很舒服。
RSS
用 RSS包配合 nuxt-content , 找了篇博客,复制上也能用了。
评论
railway.app 跑了个 cusdis ,自己写了个组件调开放接口,是最费功夫的部分。
还遇到个小坑,请求时的pageId和响应结果里的pageId有点子不同,响应结果里的pageId是根据请求的Id生成的,使用响应结果里的pageId作为请求参数,会重新生成一个新的Page,这样生成的评论可以在管理后台看到,但在开放接口里请求不到,排查了好大一会 Orz 。
最后
最让我感觉爽的是,想用 turnstile 给评论的表单做个验证,也有nuxt-turnstile可以用。
整个流程下来,最多的时间花在熟悉 nuxt 上了(之前只用过 vue ),花在功能业务上时间很少,或者说功能做起来都比较顺利,显得时间短。
对我来说(用过 vue ,但前端菜🐔),用 nuxt 完成博客文章列表、文章渲染、代码高亮、多语言、暗黑模式等等,比写一个 hugo 的主题要简单的多(各种 api 看的头大),感觉大家都可以去试试哈哈😄。
您需要登录后才可以回帖 登录 | 立即注册

返回顶部