285 lines
20 KiB
Markdown
285 lines
20 KiB
Markdown
|
||
<img src="./images/1131.png" width = "405" height = "511" alt="Firefly" align=right />
|
||
|
||
<div align="center">
|
||
|
||
# Firefly
|
||
> Свежая и красивая тема для блога на Astro
|
||
>
|
||
> 
|
||
|
||
|
||
|
||
>
|
||
> [](https://github.com/CuteLeaf/Firefly/stargazers)
|
||
[](https://github.com/CuteLeaf/Firefly/network/members)
|
||
[](https://github.com/CuteLeaf/Firefly/issues)
|
||
>
|
||
> 
|
||
[](https://deepwiki.com/CuteLeaf/Firefly)
|
||
[](https://afdian.com/a/cuteleaf)
|
||
</div>
|
||
|
||
|
||
---
|
||
🚀 Быстрое руководство:
|
||
[**🖥️Демо**](https://firefly.cuteleaf.cn/) /
|
||
[**📝Документация**](https://docs-firefly.cuteleaf.cn/) /
|
||
[**🍀Мой блог**](https://blog.cuteleaf.cn)
|
||
|
||
📖 README:
|
||
**[简体中文](../README.md)** | **[繁體中文](README.zh-TW.md)** | **[English](../README.en.md)** | **[日本語](README.ja.md)** | **[Русский](README.ru.md)**
|
||
|
||
⚡ Генерация статического сайта: Сверхбыстрая загрузка и SEO-оптимизация на основе Astro
|
||
|
||
🎨 Современный дизайн: Чистый и красивый интерфейс с настраиваемыми цветами темы
|
||
|
||
📱 Мобильная адаптация: Идеальный адаптивный опыт с оптимизацией для мобильных устройств
|
||
|
||
🔧 Высокая настраиваемость: Большинство функций можно настроить через конфигурационные файлы
|
||
|
||
<img alt="firefly" src="./images/1.webp" />
|
||
|
||
>[!TIP]
|
||
>В важных макетах Firefly инновационно добавляет двойные боковые панели, сеточный макет статей (многоколонный), макет Masonry,
|
||
>
|
||
>Включает статистику сайта, календарный компонент, оглавление статей и другие виджеты для обогащения боковой панели,
|
||
>
|
||
>При этом сохраняется система макетов fuwari, свободно переключаемая в конфигурационном файле.
|
||
>
|
||
>**Подробнее о настройках макета и демонстрациях см.: [Детали системы макетов Firefly](https://firefly.cuteleaf.cn/posts/firefly-layout-system/)**
|
||
|
||
## ✨ Возможности
|
||
|
||
### Основные функции
|
||
|
||
- [x] **Astro + Tailwind CSS** - Сверхбыстрая генерация статических сайтов на основе современного технологического стека
|
||
- [x] **Плавная анимация** - Анимация переходов между страницами Swup для шелковисто-плавного просмотра
|
||
- [x] **Адаптивный дизайн** - Идеальная адаптация для настольных компьютеров, планшетов и мобильных устройств
|
||
- [x] **Многоязычная поддержка** - Интернационализация i18n, поддержка упрощенного китайского, традиционного китайского, английского, японского, русского
|
||
- [x] **Полнотекстовый поиск** - Клиентский поиск на основе Pagefind, поддержка индексации содержимого статей. Также поддержка поисковой системы MeiliSearch
|
||
|
||
### Персонализация
|
||
- [x] **Боковая панель** - Поддержка одиночной и двойной боковой панели, свободное переключение на фронтенде
|
||
- [x] **Макет статей** - Поддержка списка (один столбец) и сетки (многоколонный/Masonry), свободное переключение на фронтенде
|
||
- [x] **Управление шрифтами** - Поддержка пользовательских шрифтов с богатым выбором шрифтов
|
||
- [x] **Настройка подвала** - Внедрение HTML-контента, полная настраиваемость
|
||
- [x] **Настройка навигации** - Логотип, заголовок, ссылки полностью настраиваются
|
||
- [x] **Переключение режимов обоев** - Баннерные обои, полноэкранные обои, однотонный фон, свободное переключение на фронтенде
|
||
- [x] **Настройка цвета темы** - Регулировка оттенка на 360°, поддержка светлого/темного/системного режимов, свободное переключение на фронтенде
|
||
|
||
### Компоненты страницы
|
||
- [x] **Гостевая книга** - Поддержка страницы гостевой книги с интегрированной системой комментариев
|
||
- [x] **Панель объявлений** - Верхнее уведомление с объявлениями, поддержка закрытия и пользовательских стилей
|
||
- [x] **Маскот** - Поддержка двух анимационных движков: Spine и Live2D
|
||
- [x] **Статистика сайта** - Отображение количества статей, категорий, тегов, общего количества слов, времени работы, времени последнего обновления
|
||
- [x] **Календарь сайта** - Отображение календаря текущего месяца и опубликованных статей за месяц
|
||
- [x] **Страница спонсоров** - Несколько способов оплаты, QR-коды для платежей, список спонсоров, кнопка спонсорства в статьях
|
||
- [x] **Постер для публикации** - Поддержка создания красивых постеров для публикации статей, содержащих краткое содержание статьи, QR-код и т.д.
|
||
- [x] **Эффект сакуры** - Поддержка эффекта сакуры, полноэкранная анимация сакуры
|
||
- [x] **Дружественные ссылки** - Красивые карточки отображения дружественных ссылок
|
||
- [x] **Рекламный компонент** - Поддержка пользовательского рекламного контента на боковой панели
|
||
- [x] **Bangumi** - Отображение отслеживания аниме и игр на основе Bangumi API
|
||
- [x] **Система комментариев** - Интеграция систем комментариев Twikoo, Waline, Giscus, Disqus, Artalk
|
||
- [x] **Счетчик посещений** - Поддержка вызова встроенного отслеживания посещений Waline, Twikoo
|
||
- [x] **Музыкальный плеер** - На основе APlayer, поддержка локальной музыки и онлайн-музыки через Meting API
|
||
|
||
### Улучшение контента
|
||
- [x] **Лайтбокс изображений** - Функция предварительного просмотра изображений Fancybox
|
||
- [x] **Плавающее оглавление** - Динамическое отображение оглавления статьи, поддержка якорных переходов, показывается при скрытии оглавления боковой панели
|
||
- [x] **Защита электронной почты** - Предотвращает сбор адресов электронной почты автоматическими сканерами во избежание спама
|
||
- [x] **Оглавление боковой панели** - Динамическое отображение оглавления статьи, поддержка якорных переходов
|
||
- [x] **Улучшенные блоки кода** - На основе Expressive Code, поддержка сворачивания кода, номеров строк, идентификации языка
|
||
- [x] **Поддержка математических формул** - Движок рендеринга KaTeX, поддержка встроенных и блочных формул
|
||
- [x] **Расширения Markdown** - [Расширенные возможности Markdown](https://github.com/saicaca/fuwari?tab=readme-ov-file#-markdown-extended-syntax), также включает [Admonitions](https://firefly.cuteleaf.cn/posts/markdown-extended/#%E6%8F%90%E9%86%92%E6%A1%86), [карточки репозиториев GitHub](https://firefly.cuteleaf.cn/posts/markdown-extended/#github-%E4%BB%93%E5%BA%93%E5%8D%A1%E7%89%87), [Expressive Code](http://firefly.cuteleaf.cn/posts/code-examples/)
|
||
- [x] **Случайные обложки статей** - Поддержка получения случайных обложек через API
|
||
|
||
### SEO
|
||
- [x] **SEO-оптимизация** - Полные мета-теги и структурированные данные
|
||
- [x] **RSS-лента** - Автоматическая генерация RSS-ленты
|
||
- [x] **Карта сайта** - Автоматическая генерация XML-карты сайта с настройкой фильтрации страниц
|
||
|
||
|
||
## 📝 Планы...
|
||
|
||
- [ ] **Рефакторинг маскота Live2D**
|
||
- [ ] **Непрерывная оптимизация плавности анимации**
|
||
- [ ] Больше функций в разработке...
|
||
|
||
Если у вас есть полезные функции и оптимизации, пожалуйста, отправьте [Pull Request](https://github.com/CuteLeaf/Firefly/pulls)
|
||
|
||
## 🚀 Быстрый старт
|
||
|
||
### Требования
|
||
|
||
- Node.js ≤ 22
|
||
- pnpm ≤ 9
|
||
|
||
### Локальная разработка
|
||
|
||
1. **Клонировать репозиторий:**
|
||
```bash
|
||
git clone https://github.com/Cuteleaf/Firefly.git
|
||
cd Firefly
|
||
```
|
||
**Сначала создайте [Fork](https://github.com/CuteLeaf/Firefly/fork) в свой репозиторий, затем клонируйте (рекомендуется)**
|
||
```bash
|
||
git clone https://github.com/you-github-name/Firefly.git
|
||
cd Firefly
|
||
```
|
||
3. **Установить зависимости:**
|
||
```bash
|
||
# Установите pnpm, если еще не установлен
|
||
npm install -g pnpm
|
||
|
||
# Установить зависимости проекта
|
||
pnpm install
|
||
```
|
||
|
||
4. **Настроить блог:**
|
||
- Отредактируйте конфигурационные файлы в каталоге `src/config/` для настройки блога
|
||
|
||
5. **Запустить сервер разработки:**
|
||
```bash
|
||
pnpm dev
|
||
```
|
||
Блог будет доступен по адресу `http://localhost:4321`
|
||
|
||
### Развертывание на платформе хостинга
|
||
- **См. [официальное руководство](https://docs.astro.build/ru/guides/deploy/) для развертывания блога на Vercel, Netlify, GitHub Pages, Cloudflare Pages, EdgeOne Pages и т.д.**
|
||
|
||
Пресет фреймворка: `Astro`
|
||
|
||
Корневой каталог: `./`
|
||
|
||
Каталог вывода: `dist`
|
||
|
||
Команда сборки: `pnpm run build`
|
||
|
||
Команда установки: `pnpm install`
|
||
|
||
## 📖 Настройка
|
||
|
||
> 📚 **Подробная документация по настройке**: См. [документацию Firefly](https://docs-firefly.cuteleaf.cn/) для полного руководства по настройке
|
||
|
||
### Установка языка сайта
|
||
|
||
Чтобы установить язык по умолчанию для вашего блога, отредактируйте файл `src/config/siteConfig.ts`:
|
||
|
||
```typescript
|
||
// Определить язык сайта
|
||
const SITE_LANG = "zh_CN";
|
||
```
|
||
|
||
**Поддерживаемые коды языков:**
|
||
- `zh_CN` - Упрощенный китайский
|
||
- `zh_TW` - Традиционный китайский
|
||
- `en` - Английский
|
||
- `ja` - Японский
|
||
- `ru` - Русский
|
||
|
||
|
||
### Структура конфигурационных файлов
|
||
|
||
```
|
||
src/
|
||
├── config/
|
||
│ ├── index.ts # Индексный файл конфигурации
|
||
│ ├── siteConfig.ts # Базовая конфигурация сайта
|
||
│ ├── backgroundWallpaper.ts # Конфигурация фоновых обоев
|
||
│ ├── profileConfig.ts # Конфигурация профиля пользователя
|
||
│ ├── commentConfig.ts # Конфигурация системы комментариев
|
||
│ ├── announcementConfig.ts # Конфигурация объявлений
|
||
│ ├── licenseConfig.ts # Конфигурация лицензии
|
||
│ ├── footerConfig.ts # Конфигурация подвала
|
||
│ ├── FooterConfig.html # HTML-контент подвала
|
||
│ ├── expressiveCodeConfig.ts # Конфигурация подсветки кода
|
||
│ ├── sakuraConfig.ts # Конфигурация эффекта сакуры
|
||
│ ├── fontConfig.ts # Конфигурация шрифтов
|
||
│ ├── sidebarConfig.ts # Конфигурация макета боковой панели
|
||
│ ├── navBarConfig.ts # Конфигурация навигационной панели
|
||
│ ├── musicConfig.ts # Конфигурация музыкального плеера
|
||
│ ├── pioConfig.ts # Конфигурация маскота
|
||
│ ├── adConfig.ts # Конфигурация рекламы
|
||
│ ├── friendsConfig.ts # Конфигурация дружественных ссылок
|
||
│ ├── sponsorConfig.ts # Конфигурация спонсоров
|
||
│ └── coverImageConfig.ts # Конфигурация обложек статей
|
||
```
|
||
|
||
|
||
## ⚙️ Frontmatter статьи
|
||
|
||
```yaml
|
||
---
|
||
title: My First Blog Post
|
||
published: 2023-09-09
|
||
description: This is the first post of my new Astro blog.
|
||
image: ./cover.jpg # Или используйте "api" для включения случайных обложек
|
||
tags: [Foo, Bar]
|
||
category: Front-end
|
||
draft: false
|
||
lang: zh-CN # Устанавливайте только если язык статьи отличается от языка сайта в `siteConfig.ts`
|
||
---
|
||
```
|
||
|
||
## 🧞 Команды
|
||
|
||
Все команды должны выполняться в корневом каталоге проекта:
|
||
|
||
| Команда | Действие |
|
||
|:---------------------------|:----------------------------------------------------|
|
||
| `pnpm install` | Установить зависимости |
|
||
| `pnpm dev` | Запустить локальный сервер разработки на `localhost:4321` |
|
||
| `pnpm build` | Собрать сайт в `./dist/` |
|
||
| `pnpm preview` | Локальный предварительный просмотр собранного сайта |
|
||
| `pnpm check` | Проверить код на наличие ошибок |
|
||
| `pnpm format` | Отформатировать код с помощью Biome |
|
||
| `pnpm new-post <filename>` | Создать новую статью |
|
||
| `pnpm astro ...` | Выполнить `astro add`, `astro check` и другие команды |
|
||
| `pnpm astro --help` | Показать справку Astro CLI |
|
||
|
||
## 🙏 Благодарности
|
||
|
||
- Особая благодарность [saicaca](https://github.com/saicaca) за разработку шаблона [Fuwari](https://github.com/saicaca/fuwari), на котором основан Firefly
|
||
- Использованы решения [Bangumi Collection Display](https://kasuha.com/posts/fuwari-enhance-ep2/) и [Email Protection/Image Title](https://kasuha.com/posts/fuwari-enhance-ep1/), которыми поделился блогер [Kasuha](https://kasuha.com)
|
||
- За основу взяты решения [Mizuki](https://github.com/matsuzaka-yuki/Mizuki) для заголовка баннера, многоуровневой панели навигации меню, эффекта сакуры, KaTeX и Fancybox
|
||
- Построено с использованием [Astro](https://astro.build) и [Tailwind CSS](https://tailwindcss.com)
|
||
- Использует музыкальный плеер [MetingJS](https://github.com/metowolf/MetingJS) и [APlayer](https://github.com/MoePlayer/APlayer)
|
||
- Использует модель маскота в стиле Чиби `Firefly` spine, предоставленную создателем Bilibili [公公的日常](https://space.bilibili.com/3546750017080050)
|
||
- Иконки от [Iconify](https://iconify.design/)
|
||
- Авторские права на изображения Firefly принадлежат компании [miHoYo](https://www.mihoyo.com/), разработчику игры ["Honkai: Star Rail"](https://sr.mihoyo.com/).
|
||
|
||
## 📝 Лицензия
|
||
|
||
Этот проект распространяется под лицензией [MIT license](https://mit-license.org/), подробности см. в файле [LICENSE](../LICENSE).
|
||
|
||
**Уведомление об авторских правах:**
|
||
- Copyright (c) 2024 [saicaca](https://github.com/saicaca) - [fuwari](https://github.com/saicaca/fuwari)
|
||
- Copyright (c) 2025 [CuteLeaf](https://github.com/CuteLeaf) - [Firefly](https://github.com/CuteLeaf/Firefly)
|
||
|
||
В соответствии с лицензией MIT вы можете свободно использовать, изменять и распространять код, но обязаны сохранять вышеуказанное уведомление об авторских правах.
|
||
|
||
## 🍀 Участники
|
||
|
||
Спасибо следующим участникам за их вклад в этот проект. Если у вас есть вопросы или предложения, пожалуйста, отправьте [Issue](https://github.com/CuteLeaf/Firefly/issues) или [Pull Request](https://github.com/CuteLeaf/Firefly/pulls).
|
||
|
||
<a href="https://github.com/CuteLeaf/Firefly/graphs/contributors">
|
||
<img src="https://contrib.rocks/image?repo=CuteLeaf/Firefly" />
|
||
</a>
|
||
|
||
|
||
|
||
## ⭐ История звезд
|
||
|
||
[](https://star-history.com/#CuteLeaf/Firefly&Date)
|
||
|
||
|
||
<!-- ALL-CONTRIBUTORS-LIST:START - Do not remove or modify this section -->
|
||
<!-- prettier-ignore-start -->
|
||
<!-- markdownlint-disable -->
|
||
|
||
<!-- markdownlint-restore -->
|
||
<!-- prettier-ignore-end -->
|
||
|
||
<!-- ALL-CONTRIBUTORS-LIST:END -->
|