这是一个使用 Hugo 构建的静态博客，采用了 Tailwind CSS 进行样式设计。
- ⚡ 快速构建 - Hugo 提供极速的构建速度
- 🎨 现代化设计 - 使用 Tailwind CSS 构建响应式界面
- 📝 Markdown 支持 - 使用 Markdown 格式编写文章
- 🔍 SEO 优化 - 良好的搜索引擎优化支持
- 🌙 美观样式 - 现代化的卡片式布局和配色方案
- Node.js >= 16.0.0
- Npm >= 8.0.0
- Hugo >= 0.120.0
Windows:
# 使用 Chocolatey
choco install nodejs
# 或下载安装包
# 访问 https://nodejs.org/ 下载 LTS 版本macOS:
# 使用 Homebrew
brew install node
# 或下载安装包
# 访问 https://nodejs.org/ 下载 LTS 版本Linux (Ubuntu/Debian):
# 使用 apt
sudo apt update
sudo apt install nodejs npm
# 或使用 NodeSource
curl -fsSL https://deb.nodesource.com/setup_lts.x | sudo -E bash -
sudo apt-get install -y nodejsWindows:
# 使用 Chocolatey
choco install hugo
# 或使用 Scoop
scoop install hugomacOS:
# 使用 Homebrew
brew install hugoLinux:
# 使用 Snap
sudo snap install hugo
# 或从 GitHub Releases 下载
# 访问 https://github.com/gohugoio/hugo/releases# 全局安装
npm install -g wrangler
# 登录 Cloudflare
wrangler logingit clone https://github.com/pengcunfu/blog.git
cd blognpm install# 启动开发服务器
hugo server -D
# 或者使用 watch 模式
hugo server -D --watch访问 http://localhost:1313 查看博客
# 生产环境构建
hugo --minify
# 包含草稿文章构建
hugo --buildDrafts --minify构建后的文件将输出到 public/ 目录。
blog/
├── content/ # 内容目录
│ ├── _index.md # 主页内容
│ └── posts/ # 博客文章
├── layouts/ # 模板目录
│ ├── _default/ # 默认模板
│ └── partials/ # 部分模板
├── static/ # 静态资源
├── assets/ # 资源文件
│ └── css/ # CSS 文件
├── data/ # 数据文件
├── archetypes/ # 内容模板
├── config/ # 配置文件
├── public/ # 构建输出目录
├── resources/ # 资源缓存
├── hugo.toml # Hugo 配置文件
├── package.json # Npm 配置
├── tailwind.config.js # Tailwind 配置
├── postcss.config.js # PostCSS 配置
└── deploy.js # 部署脚本
# 创建新文章
hugo new posts/my-new-post.md
# 创建带日期的文章
hugo new posts/2024/my-new-post.md+++
title = "文章标题"
date = 2024-01-01T12:00:00+08:00
draft = true
author = "黎明怀羽"
tags = ["标签1", "标签2"]
categories = ["分类"]
+++
文章内容...项目提供了自动部署脚本到 Cloudflare Pages：
# 部署到生产环境
node deploy.js
# 部署到预览环境
node deploy.js --preview
# 只构建不部署
node deploy.js --dry-run
# 构建包含草稿的文章
node deploy.js --draft- 将
public/目录中的所有文件上传到 Cloudflare Pages - 配置自定义域名（可选）
你可以设置 GitHub Actions 自动部署：
- 将代码推送到 GitHub
- 在 Cloudflare Pages 中连接 GitHub 仓库
- 配置自动触发部署
编辑 tailwind.config.js 来自定义 Tailwind CSS 配置：
module.exports = {
content: ["./content/**/*.{html,md}"],
theme: {
extend: {
// 自定义配置
},
},
plugins: [],
}编辑 hugo.toml 来自定义网站配置：
baseURL = 'https://yourdomain.com/'
languageCode = 'zh-cn'
title = '你的博客标题'
[params]
description = '博客描述'
author = '作者名称'# 开发
hugo server -D # 启动开发服务器
hugo server -D --watch # 启动开发服务器并监听文件变化
# 构建
hugo # 构建（排除草稿）
hugo --buildDrafts # 构建（包含草稿）
hugo --minify # 优化构建
# 内容管理
hugo new posts/article-name.md # 创建新文章
hugo new about.md # 创建新页面
# 部署
node deploy.js # 部署到生产环境
node deploy.js --preview # 部署到预览环境本项目采用 MIT 许可证。
欢迎提交 Issue 和 Pull Request
- GitHub: @pengcunfu
"学而时习之，不亦说乎" - 孔子