用 Astro 搭建个人技术博客

这个博客本身就是用 Astro 搭建的。这篇文章记录一下为什么这么选，以及整体是怎么跑起来的。

为什么不用纯 Vue 单页应用

纯 Vue 单页应用打开时，服务器返回的 HTML 几乎是空的，文章内容要等浏览器下载完 JS 才会显示出来。对博客来说会带来几个问题：

1. 搜索引擎抓到的可能是空页面，文章不容易被搜到。
2. 第一次打开要先下载整个应用的 JS，速度偏慢。
3. Markdown 转页面、代码高亮、目录这些功能都要自己拼插件。

Astro 在打包时就把每篇文章生成成完整的 HTML 文件，打开就能直接看到内容，默认不往页面里塞任何 JS。

写一篇新文章

在 src/content/blog/ 目录下新建一个 .md 文件，开头写上文章信息：

---
title: 文章标题
description: 一句话简介，会显示在文章列表里
pubDate: 2026-10-24
tags: [Java, Spring]
draft: false
---

正文从这里开始。

文件名就是文章的网址，比如 hello-world.md 对应 /blog/hello-world/。

本地预览和打包

# 安装依赖（只需要第一次执行）
npm install

# 本地预览，浏览器打开 http://localhost:4321
npm run dev

# 打包，生成的静态文件在 dist 目录
npm run build

部署

打包出来的 dist 目录全是静态文件，上传到服务器后交给 nginx 直接返回即可，服务器上不需要安装 Node.js。