Astral Halo
[!WARNING] 該項目仍在開發中,可能存在 bug,且會有破壞性變更。請謹慎使用。
線上預覽(Netlify) | English | 简体中文 | 繁體中文
Astral Halo 是一個基於 Astro 開發的靜態部落格模板。
[!NOTE] 本專案託管於以下倉庫:
- Codeberg(主倉庫):HPCesia/AstralHalo
- GitHub(鏡像):HPCesia/astral-halo
鏡像倉庫僅用於收集 issue,不接受 PR。
功能特性/TODO
- 基於 Astro 和 Tailwind CSS(使用 daisyUI)開發
- 可自由切換的明亮/暗黑主題
- 響應式設計
- 搜尋(目前僅支援 Pagefind)
- 響應式的文章目錄顯示
- 部分支援 Obsidian 特性
- Callout
- Wiki 連結(僅支援對文章的連結)
- 反向連結(僅支援對 Wiki 連結的反向連結顯示)
- 評論系統,支援:
- 各種各樣可在文章中使用的元件
- 流暢的動畫和頁面過渡
- 實用 JS 指令碼工具
- PWA 支援
使用方法
-
使用此模板生成新儲存庫或 Fork 此儲存庫。
-
進行本地開發,克隆儲存庫到本地,執行
pnpm install安裝依賴,執行pnpm dev啟動開發伺服器。- 若未安裝 pnpm,請先執行
npm install -g pnpm安裝 pnpm。
- 若未安裝 pnpm,請先執行
-
通過配置檔案
src/config.ts自訂部落格,配置說明位於src/types/config.ts的文件註釋中。 -
執行
pnpm new建立新草稿。編寫完成後執行pnpm pub發布文章到src/content/posts目錄。 -
參考官方指南將部落格部署至 Vercel, Netlify, GitHub Pages 等;部署前需編輯 astro.config.mjs 中的網站設定。
文章 Front Matter
---
title: 文章標題
slug: post-entry # 文章將生成至 [BASE_URL]/posts/post-entry/ 路徑下
published: 1970-01-01T00:00:00Z
description: 文章描述
category: Lorem
tags: [Foo, Bar]
cover: /path/to/cover.jpg
lang: zh-TW # 僅當文章語言與 `config.ts` 中網站語言不同時需要設定
comment: true # 是否啟用評論,需要在 `config.ts` 中啟用並配置評論系統
---
指令
下列指令均需要在專案根目錄執行:
| 指令 | 行為 |
|---|---|
pnpm install |
安裝依賴 |
pnpm dev |
在 localhost:4321 啟動開發伺服器 |
pnpm build |
構建靜態網站到 ./dist/ 目錄 |
pnpm preview |
本地預覽構建的靜態網站 |
pnpm new |
建立新文章 |
pnpm pub |
發布草稿 |
pnpm lint |
檢查程式碼 |
pnpm format |
格式化程式碼 |
pnpm astro ... |
執行 Astro CLI |