绝了！一款简洁优雅的高性能个人博客系统！

大家好，我是 Java陈序员。

作为一名程序员，你是否会想搭建个人技术博客，却被各种技术配置搞得头大？用静态博客系统要手动部署，用动态系统又担心速度太慢，找图床、配评论、做统计还要东拼西凑各种工具？

今天，给大家介绍一款简洁优雅的高性能个人博客系统，开箱即用！

VanBlog —— 一款简洁、实用、优雅的个人博客系统，内置了流量统计和图床，集成了评论系统，并支持全自动按需申请 https 证书、黑暗模式、移动端自适应等。

此外，VanBlog 还具有无限的可扩展性，提供完备的后台管理面板，支持黑暗模式、移动端、一键上传剪贴板图片到图床，并带有强大的编辑器。

功能特色：

优雅：前后台都响应式、都支持暗色模式且能自动切换功能强大：支持草稿、分类、标签、搜索、TOC、内嵌评论系统、图标和数学公式定制化：可添加自定义 HTML、CSS、JS，强大的流水线功能，后续将支持主题与插件内置图床：本地图床、OSS 图床、Github 图床都支持，可一键上传剪切板图片，自动添加水印，自动压缩图片高性能：快到极致的静态页面，秒响应的增量渲染，Lighthouse 近满分SEO 友好：Lighthouse SEO 近满分，支持百度分析和 GA，支持自定义文章路径可量化：内置强大分析系统与精美看板，同时支持百度和GA，同时具有完善的日志现代后台：功能齐全的后台，精心优化的编辑器，极致的写作体验安全第一：内置了可以自定义权限的协作者模式，未来将支持更多登录安全策略易于部署：Docker 一键部署，全自动 HTTPS 证书自动申请续期，支持 ARM

VanBlog 支持 Docker 部署，可使用 Dcoker Compose 一键部署。

1、创建 vanblog目录并在这个目录下新建 docker-compose.yaml 文件

version: '3'services:vanblog:# 阿里云镜像源# image: registry.cn-beijing.aliyuncs.com/mereith/van-blog:latestimage: mereith/van-blog:latestrestart: alwaysenvironment:TZ: 'Asia/Shanghai'# 邮箱地址，用于自动申请 https 证书EMAIL: 'someone@mereith.com'volumes:# 图床文件的存放地址，按需修改。- ${PWD}/data/static:/app/static# 日志文件- ${PWD}/log:/var/log# Caddy 配置存储- ${PWD}/caddy/config:/root/.config/caddy# Caddy 证书存储- ${PWD}/caddy/data:/root/.local/share/caddyports:# 前面的是映射到宿主机的端口号，改端口的话改前面的。- 80:80- 443:443mongo:# 某些机器不支持 avx 会报错，所以默认用 v4 版本。有的话用最新的。image: mongo:4.4.16restart: alwaysenvironment:TZ: 'Asia/Shanghai'volumes:- ${PWD}/data/mongo:/data/db

2、启动项目

docker-compose up -d

3、浏览器访问，并按照指引完成初始化

http:///admin/init

具体的站点配置，可参考：

首页文章阅读文章评论文章分类时间线后台管理分析概览文章管理草稿管理图片管理站点管理本地开发环境准备Node.js 18+pnpm v7+MongoDB克隆项目并安装依赖git clone https://github.com/Mereithhh/vanblog.gitcd vanblogpnpm i添加 server 配置文件

在 packages/server 下，创建 config.yaml 文件，内容如下：

database:# 数据库连接url: mongodb://localhost:27017/vanBlog?authSource=adminstatic:# 图床等静态文件保存的位置path: /var/vanblog-dev/static# 是否开启演示站模式，会限制很多权限demo: 'false'# waline 用的表名，会自动创建waline:db: waline# 日志位置log: /var/vanblog-dev/logs

数据库连接需要改成对应的连接地址以及用户名密码。

一键启动服务# 开发全部（前台、后台、server）pnpm dev单独运行服务

1、必须先启动 server

# 端口 3000pnpm dev:server

2、然后再启动前台或者后台

# 启动前台 端口 3001pnpm dev:website# 启动后台 端口 3002pnpm dev:admin浏览器访问## 前台http://localhost:3001## 后台，访问成功后，按照指引完成初始化http://localhost:3002

可以说，VanBlog 以其高性能、丰富的功能、良好的用户体验和简单的部署方式，为个人博客搭建提供了一个优秀的解决方案。快去试试吧~

项目地址：https://github.com/Mereithhh/vanblog

推荐的开源项目已经收录到 GitHub 项目，欢迎 Star：