Gumori - 支持 React/Svelte/Vue 组件的极简静态博客模板

[M9l7chlLGv]

GitHub: https://github.com/importantimport/gumori

Demo: https://gumori.netlify.app

特征

基于 Astro 。

行内高亮

Astro 没有 MDsveX 的兼容性问题，就用了最时髦的 rehype-pretty-code，它可以给行内代码高亮。

还有一些额外的功能比如单词突出显示之类，但我没写对应的样式。

最小样式

必要 CSS 不到 1KB （用来适配上面的代码高亮），模板本身就只是语义化 HTML 。

现代生态

如题，不过目前在一些方面会比较简陋

完整的兼容框架列表：React, Preact, Svelte, Vue, SolidJS, AlpineJS, Lit

深度定制

由于上面这些特点，可以基于它写一个自己的分支（或者叫主题），也能搭配无类 CSS 主题使用（比如演示站默认引用的是 new.css ）

使用

也可以点 README 的 "Open in StackBlitz" 按钮体验

npx degit importantimport/gumori my-blog && cd my-blog # 下载到当前路径的 my-blog 文件夹下
npm i -g pnpm # 安装 pnpm ，已有则跳过此段
pnpm i # 安装依赖
pnpm dev # 开发
pnpm build # 构建

• 配置：./src/config/gumori.ts
• 帖文：./src/posts/
• 静态文件：./public/

还可以看看

• Gumori You: 实现了 Material You 根据内容配色的分支（ WIP ）
  • https://github.com/importantimport/gumori-you
• Urara: 有不少花里胡哨功能的 SvelteKit 博客模板
  • https://github.com/importantimport/urara

[J1Feng]

折腾从未停止，写作从未开始 ：）

[gausszhou]

@J1Feng 哈哈 : )

[M9l7chlLGv]

@J1Feng 显然折腾也是写作的一部分 :)