# 11ty-theme-wintergreen

**Repository Path**: exyone/11ty-theme-wintergreen

## Basic Information

- **Project Name**: 11ty-theme-wintergreen
- **Description**: A minimal theme for eleventy-notes.
- **Primary Language**: HTML
- **License**: BSD-2-Clause
- **Default Branch**: main
- **Homepage**: https://11ty-theme-wintergreen.edgeone.dev/
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2026-01-21
- **Last Updated**: 2026-01-24

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# Eleventy Theme Wintergreen

一个现代的、可自定义的 Eleventy 模板，用于创建个人网站和博客。基于 [Eleventy](https://11ty.dev/)、[Alpine.js](https://alpinejs.dev/) 和 [Sass](https://sass-lang.com/) 构建，Wintergreen 提供了一个干净、IDE 风格的设计，拥有出色的排版和性能。

## 功能特性

- ✅ 快速轻量的静态网站生成
- ✅ 响应式设计，适配所有屏幕尺寸
- ✅ 暗色模式支持，采用 IDE 风格配色方案
- ✅ 通过简单配置即可自定义
- ✅ 出色的 Markdown 支持，带语法高亮
- ✅ 客户端搜索功能
- ✅ 基于标签的内容组织
- ✅ Wikilinks 和反向链接支持
- ✅ 极简 JavaScript，性能更优
- ✅ 多语言支持，优化字体堆栈

## 快速开始

### 环境要求

- Node.js（推荐 v16+）
- npm 或 yarn

### 安装步骤

1. **克隆仓库**

```bash
git clone https://github.com/yourusername/eleventy-theme-wintergreen.git
cd eleventy-theme-wintergreen
```

2. **安装依赖**

```bash
npm install
```

3. **启动开发服务器**

```bash
npm start
```

这将在 `http://localhost:8080` 启动本地开发服务器。

4. **构建生产版本**

```bash
npm run build
```

这将在 `dist` 目录中生成静态文件。

## 自定义配置

### 基本配置

编辑根目录下的 `app.mjs` 文件来自定义您的网站：

- **title**：网站标题
- **description**：网站描述
- **lang**：网站语言
- **sidebar.links**：侧边栏导航链接
- 以及其他更多配置！

### 添加内容

在根目录或子目录中创建新的 Markdown 文件。每个文件应包含前言部分：

```yaml
---
title: 我的第一篇文章
layout: note
parent: /posts
tags: [教程, 示例]
date: 2024-01-01
---

# 内容写在这里
```

### 自定义样式

修改 `.app/css` 目录中的 SCSS 文件来自定义主题外观：

- `.app/css/1-tokens/` - 配色方案和设计标记
- `.app/css/4-components/` - 组件特定样式
- `.app/css/app.scss` - 主样式表

## 部署上线

Wintergreen 生成的静态文件可以部署到任何静态托管服务：

- [GitHub Pages](https://pages.github.com/)
- [Netlify](https://www.netlify.com/)
- [Vercel](https://vercel.com/)
- [AWS S3](https://aws.amazon.com/s3/)
- [Google Cloud Storage](https://cloud.google.com/storage)

## 项目结构

```
├── .app/               # 核心应用文件
│   ├── _data/          # Eleventy 数据文件
│   ├── css/            # SCSS 样式表
│   ├── js/             # JavaScript 文件
│   ├── lib/            # 应用模块
│   ├── pages/          # Eleventy 页面模板
│   └── scripts/        # 构建脚本
├── posts/              # 示例博客文章
├── public/             # 静态资源
├── app.mjs             # 主配置文件
├── package.json        # 项目依赖
└── README.md           # 此文件
```

## 技术栈

- [Eleventy](https://11ty.dev/) - 静态网站生成器
- [Alpine.js](https://alpinejs.dev/) - 极简 JavaScript 框架
- [Sass](https://sass-lang.com/) - CSS 预处理器
- [Lucide](https://lucide.dev/) - 图标库
- [Pagefind](https://pagefind.app/) - 客户端搜索
- [Prism](https://prismjs.com/) - 语法高亮

## 许可证

BSD 2-Clause 许可证

## 致谢

Wintergreen 基于 [Sandro Roth](https://github.com/rothsandro) 的优秀模板 [eleventy-notes](https://github.com/rothsandro/eleventy-notes)。

## 贡献指南

欢迎贡献！如有任何改进或 bug 修复，请提交 issue 或 pull request。

## 支持与帮助

如果遇到任何问题或有疑问，请在 Codeberg 和 Gitee 上提交 issue。

---

_作者：Exyone Kodoreanto_