🚀 Asuka - EVA主题博客与个人站点

一个基于 Astro 构建的现代化 Monorepo 项目,包含 EVA 主题博客和赛博朋克风格个人站点

Astro TypeScript React Tailwind CSS

✨ 特色功能

🎨 EVA 主题系统

📝 博客功能

🔮 赛博朋克个人站点

🛠️ 技术栈

📁 项目结构

Asuka/
├── apps/
│ ├── blog/ # 📝 EVA主题博客
│ │ ├── src/
│ │ │ ├── components/ # React组件
│ │ │ ├── content/ # 博客文章
│ │ │ ├── layouts/ # 页面布局
│ │ │ ├── pages/ # 路由页面
│ │ │ ├── styles/ # 样式文件
│ │ │ └── utils/ # 工具函数
│ │ ├── public/ # 静态资源
│ │ └── asuka.config.ts # 博客配置
│ │
│ └── main/ # 🔮 赛博朋克个人站点
│ ├── src/
│ │ ├── components/ # 组件库
│ │ ├── config/ # 配置文件
│ │ ├── React/ # React组件
│ │ └── styles/ # 样式文件
│ └── public/ # 静态资源
│
├── docs/ # 📖 项目文档
├── templates/ # 📋 模板文件
└── package.json # Monorepo配置

🚀 快速开始

环境要求

安装依赖

# 克隆项目
git clone https://github.com/zhsama/asuka.git
cd asuka
# 安装依赖
pnpm install

开发模式

# 同时启动两个应用
pnpm dev
# 或单独启动
pnpm dev:blog # 博客 (localhost:4321)
pnpm dev:main # 主站 (localhost:4322)

构建部署

# 构建所有应用
pnpm build
# 或单独构建
pnpm build:blog
pnpm build:main
# 预览构建结果
pnpm preview

⚙️ 配置说明

博客配置 (apps/blog/asuka.config.ts)

const AsukaConfig = {
 title: "zhsama's blog",
 description: "I'm a frontend developer and AI enthusiast.",
 site: "https://blog.zhsama.xyz",
 avatarUrl: "/avatar.jpeg",
 slugMode: "HASH", // 启用Hash URL模式
 // ... 更多配置
}

主要配置项

🎨 主题使用

EVA主题切换

自定义主题

:root.eva-custom {
 --hue-primary: 180; /* 自定义主色调 */
 --hue-secondary: 60; /* 自定义辅助色 */
}

📝 写作指南

创建文章

---
title: "文章标题"
description: "文章描述"
published: 2024年01月01日
category: "技术"
tags: ["Astro", "TypeScript"]
cover: "/images/cover.jpg"
draft: false
---
# 文章内容

支持的功能

🌐 部署

Vercel (推荐)

# 安装Vercel CLI
npm i -g vercel
# 部署
vercel --prod

Netlify

# 构建命令
pnpm build
# 发布目录
dist/

Docker

FROM node:18-alpine
WORKDIR /app
COPY . .
RUN npm install -g pnpm
RUN pnpm install
RUN pnpm build
EXPOSE 3000
CMD ["pnpm", "preview"]

🤝 贡献指南

开发规范

📋 待办事项

📄 许可证

🙏 致谢

如果这个项目对你有帮助,请给个 ⭐️ 支持一下!

🔗 在线预览 | 📚 文档 | 🐛 报告问题