样式基于 Tailwind CSS 与官方 Typography 插件构建
compost — Hugo 启动器模板
作者 canstand
Compost 是一个基于 Tailwind CSS 构建的 Hugo 简洁主题,通过 Go Modules 引入,适合搭建以文章为主的个人站点。
看看你的网站会是什么样
浏览真实页面截图,比较内容排版与手机效果。点击下方缩略图切换,放大查看整页细节。
全部页面与视图 3
截图用于了解视觉与布局,交互效果请以实际项目为准。
值得关注的模板亮点
从已有项目资料中,快速了解它的特点。
通过 Go Modules 引入主题,无需 git submodule
针对简体中文文章样式做了专门定制,仅在 lang 为 zh 时生效
使用 Hugo 内置函数自动调整图片尺寸并添加原生懒加载属性
仓库内含 exampleSite 演示站点,可独立安装依赖运行
模板详细介绍
Compost 是 canstand 维护的 Hugo 主题,定位为简洁轻量的启动器,主要参考 Congo 主题,并借鉴了 hugo-starter-tailwind-basic 等项目的做法。样式基于 Tailwind CSS 与官方 Typography 插件,构建时由 Tailwind CSS CLI 处理样式表。
主题通过 Go Modules 而非 git submodule 引入,需要在 hugo.toml 中合并 build、markup、minify 配置,并挂载 assets 与 hugo_stats.json,同时为 security.exec 放行 sass、go、git、node、postcss、tailwindcss 等命令。依赖安装使用 hugo mod get、hugo mod npm pack 与 npm install。
功能方面,主题针对简体中文的文章样式做了专门定制,仅在 html 的 lang 为 zh 时生效;使用 Hugo 内置函数自动调整图片尺寸,并添加浏览器原生懒加载属性。仓库附带 exampleSite 演示站点,可独立安装依赖后运行。
使用限制:需要 Hugo v0.166.0 或更高版本,并安装 Node.js 以通过 npm 获取 Tailwind CSS CLI;主题依赖 Go Modules 与 npm 两套依赖管理,配置步骤相对固定。
适合你的项目吗?
适用场景
- 搭建以文章内容为主的个人博客或写作站点
- 需要简体中文排版优化的 Hugo 项目
- 希望以 Tailwind CSS 定制样式的 Hugo 站点
- 使用 Go Modules 管理主题依赖的 Hugo 项目
适合人群
- 熟悉 Hugo 基本配置与命令行操作的开发者
- 能使用 Node.js 与 npm 安装前端依赖的用户
- 偏好简洁文章型布局、不需要复杂页面结构的站点
- 需要中文文章样式与图片自动处理的博客作者
上手与定制指南
结合仓库当前版本的说明,按下面的资料检查内容、配置与运行要求。
- 1
需要 Hugo v0.166.0 或更高版本,并安装 Node.js 以使用 npm 安装 Tailwind CSS CLI
- 2
在 hugo.toml 中合并 build、markup、minify 配置,挂载 assets 与 hugo_stats.json,并在 security.exec 中放行 sass、go、git、node、postcss、tailwindcss
- 3
依次运行 hugo mod get -u、hugo mod npm pack、npm install 安装或升级依赖
- 4
开发演示站点需在 exampleSite 目录单独安装依赖,再以 --source exampleSite 启动 hugo server
- 5
修改 package.hugo.json 中的依赖后需重新运行 hugo mod npm pack --source exampleSite
授权与来源资料
使用条件与限制
免费使用 · 保留许可声明本次收录的是公开仓库中采用 MIT 许可的免费版本;免费范围为该版本代码,不代表外部服务或第三方素材免费。
使用时需要遵守
- 允许免费使用、修改、商用和分发该版本代码。
- 分发代码副本或实质性部分时,保留原作者版权声明和完整 MIT 许可声明。
- 代码按现状提供;担保与责任限制以原许可证及适用法律为准。
额外费用与待核对事项
- 使用该主题需要 Hugo v0.166.0 或更高版本,低于此版本无法构建。
- 必须安装 Node.js,并通过 npm 安装 Tailwind CSS CLI,否则样式表无法处理。
- 主题通过 Go Modules 引入,需按 Hugo 模块方式初始化,不能使用 git submodule 方式。
- 需在 hugo.toml 的 security.exec 中放行 sass、go、git、node、postcss、tailwindcss 等命令,否则构建会被安全策略阻止。
- 修改 package.hugo.json 中的依赖后,必须重新运行 hugo mod npm pack --source exampleSite 才能同步依赖。
- 演示图片、字体、图标及其他第三方素材需按各自许可核对,不能仅凭代码的 MIT 许可判断。
- 域名、托管、数据库、支付或 AI 等外部服务可能另外收费。
查看原文依据
Permission is hereby granted, free of charge
许可证原文
Hugo v0.166.0 or later
README 原文
[Node.js](https://nodejs.org/) (the Tailwind CSS CLI is installed with `npm`)
README 原文
This theme uses `go modules`, not `git submodule`
README 原文
[security] [security.exec] allow = [
README 原文
https://github.com/canstand/compost/blob/main/LICENSEhttps://github.com/canstand/compost/blob/main/README.mdhugo mod npm pack --source exampleSite
README 原文
DeepSeek 根据仓库许可证和 README 整理 ·2026-10-03。结果仅覆盖已读取资料,依赖、图片、字体及后续条款变更以各自原文为准。
项目核对记录与介绍依据
模板资料
- 来源平台
- Hugo Themes
- 资料与维护参考分
- 资料较完整 · 87 / 100
- 技术栈
- Hugo
- 网站类型
- 启动器
这个分数如何计算
本站按许可资料(最高30分)、演示链接(12分)、预览图(10分)、Star数(15分)、记录的维护时间(15分)、描述完整度(8分)、功能记录(5分)和分类资料(5分)计算。它不是代码、安全或性能测试,也不是 Google 评分;有链接不代表已实测可用。
这个项目需要核对什么
- 记录的仓库更新时间
- 2026-09-15
- 截图检查日期
- 2026-10-03
已收录演示链接。请用你的内容与屏幕尺寸检查;有演示不代表表单、认证或支付已经可用。
目录记录的主要技术栈是 Hugo。请通过依赖清单和锁文件核对实际版本与托管要求。这些说明基于收录资料,不代表代码审计或部署实测。
查看具体选型方法 →介绍的制作与核对状态
介绍由 AI 辅助整理目录与仓库资料。仓库作者不等于这篇介绍的审核者。
已完成服务器许可规则与 AI 来源核对;未经过人工编辑审核。
查看当时使用的来源资料
SHA-256: 18d62144a771febd5b13eaef97d916e6d5c2c6e97ea2ee943e34cbcb648f98b6
2026-10-03T00:27:27.053Z
来源文件 / 仓库# Compost Theme | Hugo
Compost is a simple, lightweight theme for [Hugo](https://gohugo.io). Mainly based on the [Congo](https://github.com/jpanther/congo), also refer to [hugo-starter-tailwind-basic](https://github.com/bep/hugo-starter-tailwind-basic) and so on.
🌏[Demo site](https://canstand.github.io/compost/) | [中文](https://canstand.github.io/compost/zh)
## Features
- Styles are based on [Tailwind CSS](https://tailwindcss.com/docs) 4.x, and the official [Typography plugin](https://github.com/tailwindlabs/tailwindcss-typography).
- You can build and test directly with the `hugo` command (using some of the tricks mentioned in [#8343](https://github.com/gohugoio/hugo/issues/8343)).
- 🌐 The article style is specially customized for the Simplified Chinese language (only applied when the lang of html is zh).
- ✨ Automatically resize images with Hugo's built-in function, and add native lazy loading attr (supported by browsers)
## Requirements
- Hugo v0.166.0 or later
- [Node.js](https://nodejs.org/) (the Tailwind CSS CLI is installed with `npm`)
## Usage
0. This theme uses `go modules`, not `git submodule`, to ensure that the [requirements](https://gohugo.io/hugo-modules/use-modules/#prerequisite) are met and to see the [instructions](https://gohugo.io/hugo-modules/use-modules/#initialize-a-new-module). ([Notes for Windows users](https://gohugo.io/getting-started/quick-start/#commands))
1. Add the required configuration to your `hugo.toml`:
```toml
# required: merge the theme's configuration (Tailwind CSS build settings)
[build]
_merge = 'deep'
# required
[markup]
_merge = 'deep'
# for better seo
[minify]
_merge = 'deep'
[module]
[[module.mounts]]
source = 'assets'
target = 'assets'
# required: hugo_stats.json is the content source of the Tailwind CSS
# stylesheet, see assets/css/main.css
[[module.mounts]]
source = "hugo_stats.json"
target = "assets/notwatching/hugo_stats.json"
disableWatch = true
[[module.imports]]
path="github.com/canstand/compost"
# required: the theme processes the stylesheet with the Tailwind CSS CLI
[security]
[security.exec]
allow = [
'^(dart-)?sass$',
'^go$',
'^git$',
'^node$',
'^postcss$',
'^tailwindcss$',
]
```
2. Install or upgrade dependencies:
```bash
hugo mod get -u
hugo mod npm pack
npm install
```
3. Then run your project as usual.
```bash
hugo server
```
## Development
The demo site lives in `exampleSite`, which is a Hugo project of its own. It needs its own dependencies, exactly like any site using the theme:
```bash
npm install
hugo mod npm pack --source exampleSite
npm install --prefix exampleSite
hugo server --source exampleSite
```
Note: if you change the dependencies in `package.hugo.json`, re-run
`hugo mod npm pack --source exampleSite`.
看看同类模板
对比同技术栈与用途的模板,找到更适合的视觉与内容结构。

hugo-xmin
eXtremely Minimal Hugo theme: about 140 lines of code in total, including HTML and CSS (with no dependencies)
Hugo · 启动器

hugo-theme-gallery
Gallery Theme for Hugo
Hugo · 启动器

reveal-hugo
📽️ Create rich HTML-based presentations with Hugo and Reveal.js
Hugo · 启动器

anatole
Anatole is a minimalistic two-column theme for Hugo.
Hugo · 启动器

hugo-theme-diary
Moments piled up. A Hugo theme ported from SumiMakito/hexo-theme-Journal.
Hugo · 启动器

risotto
A minimalist, responsive hugo theme inspired by terminal ricing aesthetics.
Hugo · 启动器
