pandaZzz 博客系统

这是一个基于 Astro 构建的现代化博客系统，专注于内容创作和阅读体验。

主要功能

• 📝 Markdown 文章支持
• 🏷️ 文章分类管理
• 📅 时间线展示
• 🖼️ 图片资源管理
• 🚀 快速响应和加载
• 📱 响应式设计

项目结构

项目采用清晰的目录结构：

• components/: 可复用的 Astro组件和Vue组件
• content/blog: 博客文章
• layouts/: 页面布局模板
• pages/: 路由页面
• styles/: 全局样式
• utils/: 工具函数

使用指南

项目使用

1. 安装依赖

npm install

2. 启动项目

npm run dev

3. 打包项目

npm run build

创建新文章

• 在 content/blog/ 下创建的一级文件夹名称为博客类型名称（如 web、thinking 等）；

• 二级文件夹为单条博客的文件夹（建议使用博客名称相关描述便于查找）；

• 在二级文件夹下创建 md 文件，编写博客内容；

• 在二级文件夹下创建 images 文件夹，存放博客图片资源；

• 图片等资源文件建议放在文章同级的 images 目录下；

• md文件中需要添加博客必要的前置信息 frontmatter：

      ---
      title: '文章标题'
      description: '文章描述'
      pubDate: '发布日期'
      heroImage: '封面图片路径'
      ---

  示例结构：

  src/content
      └── blog
          ├── life // 博客类型名称
          ├── thinking // 博客类型名称
          │   └── 2025年4月9日随想 //thinking 类型下的一条博客文件夹
          │       ├── 2025年4月9日随想.md // 博客内容
          │       └── images              // 博客图片资源
          │           └── blog-placeholder-about.jpg
          └──web
              └── markdown-style-guide
                  ├── images
                  │   ├── blog-placeholder-1.jpg
                  │   └── blog-placeholder-about.jpg
                  └── markdown-style-guide.md

⚠️注意事项

• Node.js - v18.17.1 或 v20.3.0、v22.0.0 或更高版本。（v19 和 v21 均不支持。）
• 文本编辑器 - 我们推荐使用 VS Code 并安装我们的 官方 Astro 扩展。
• 终端 - Astro 通过其命令行界面（CLI）访问。