# VitePress-Blog

**Repository Path**: CodeTV/vitepress-blog

## Basic Information

- **Project Name**: VitePress-Blog
- **Description**: 基于 VitePress 开发的博客知识库静态网站，作者：狗尾巴花的尖，专注于各种前沿技术的学习和分享，目的在于提升自身技术水平和指导日常工作
- **Primary Language**: NodeJS
- **License**: MIT
- **Default Branch**: master
- **Homepage**: https://www.flowertip.cn/vitepress-blog
- **GVP Project**: No

## Statistics

- **Stars**: 1
- **Forks**: 3
- **Created**: 2024-05-11
- **Last Updated**: 2026-02-06

## Categories & Tags

**Categories**: Uncategorized

**Tags**: 知识库, vitepress, 博客

## README



# vitepress-blog

> 狗尾巴花的尖的知识库

个人开发的博客知识库静态网站，致力于提升自身技术水平和指导日常工作。

## 简介

vitepress-blog 是一个基于 VitePress 构建的静态博客网站，旨在为技术学习者提供一个系统化的知识库平台。作者专注于各种前沿技术的学习和分享，是一个技术进阶路上的学习者，秉持"有输入就要有输出"的理念。

## 网站内容

博客涵盖六大方面的技术知识：

1. **前端技术** - 包含 Vue3 核心语法、路由、Pinia 状态管理、组件通信等
2. **后端技术** - 提供 Node.js、Express 框架等后端开发知识
3. **开发工具** - 常用开发工具推荐和使用指南
4. **问题记录** - 开发过程中遇到的问题及解决方案
5. **开源项目** - 分享作者参与或推荐的开源项目
6. **优质推荐** - 优质学习资源和平台推荐

## 技术栈

- **VitePress** - 静态站点生成器
- **Vue 3** - 前端框架
- **TypeScript** - 类型安全
- **Giscus** - 评论系统
- **Confetti** - 彩蛋效果

## 项目预览

博客展示了现代化的界面设计，包含首页展示、分类导航、标签系统等功能。

![博客效果图片](http://flowertip.cn/vitepress-blog/images/blog.png)

## 功能特性

- 响应式设计，支持各种设备访问
- 分类清晰的文档结构
- 集成 Giscus 评论系统
- 彩蛋交互效果
- 支持搜索功能
- 社交化分享

## 目录结构

```
vitepress-blog/
├── .vitepress/
│   ├── config.mts          # VitePress 配置
│   ├── sidebar.mts         # 侧边栏配置
│   └── theme/              # 主题配置
│       ├── index.ts        # 主题入口
│       ├── style.css       # 主题样式
│       └── components/     # 主题组件
│           ├── Confetti.vue    # 彩蛋组件
│           └── Giscus.vue      # 评论组件
├── docs/                       # 文档目录
│   ├── web/                    # Web 开发
│   │   ├── vue/               # Vue 技术栈
│   │   ├── node/              # Node.js
│   │   └── wechat/            # 微信小程序
│   ├── question/               # 问题记录
│   │   └── vue/               # Vue 相关问题
│   ├── tool/                  # 开发工具
│   └── recommend/             # 资源推荐
├── public/                    # 静态资源
│   ├── images/                # 图片资源
│   └── svg/                   # SVG 图标
└── index.md                   # 首页
```

## 快速开始

### 环境要求

- Node.js >= 16.0.0
- pnpm (推荐) 或 npm/yarn

### 安装依赖

```bash
pnpm install
```

### 本地开发

启动开发服务器：

```bash
pnpm docs:dev
```

### 构建生产版本

构建静态文件：

```bash
pnpm docs:build
```

### 预览构建结果

```bash
pnpm docs:preview
```

## 部署

项目已配置 GitHub Actions 自动部署流程，支持一键部署到 GitHub Pages。

## 贡献指南

欢迎提交 Issue 或 Pull Request 来完善这个知识库。

## 许可证

本项目采用 MIT 许可证开源。

## 交流

- 作者：狗尾巴花的尖
- 首页：https://gitee.com/CodeTV

---

愿你技术学习的热忱永远不会被辜负。