用 Astro 搭一个自己的博客
一直想弄个自己的地方放东西,但每次都被“我不会前端”劝退。这次换了个思路——不手写页面,直接用现成的博客框架,把精力放在内容上。
这篇记录一下整个过程,以及中途遇到的问题。
为什么选 Astro
试过几个方案,最后选 Astro,理由很实际:
- 写文章就是写 Markdown 文件,不需要登录后台,不需要数据库
- 自动生成静态页面,打开速度快,也不用管服务器
- 官方有博客模板,首页、文章列表、文章详情页全都给你写好了
对我来说最关键的是第一点。以前用那种“网页后台”的博客,写东西要打开浏览器、等加载、担心草稿丢,很打断思路。现在是本地建个 .md 文件,写完保存,就这么简单。
动手过程
核心其实只有一条命令:
npm create astro@latest my-blog -- --template blog
它会下载官方模板,里面已经包含了完整的博客结构。之后要做的事只有三类:
- 改站点信息 —— 标题、描述,改一个文件全站生效
- 删掉示例文章,写自己的
- 按喜好调配色和文字
真正花时间的不是写代码,而是决定“要写什么”。
踩到的坑
1. npm 慢得让人怀疑人生
第一次装依赖,卡了很久没动静。查下来原因是:npm 不读 Windows 的系统代理设置。
我当时挂着代理,浏览器访问外网没问题,但 npm 完全没走代理——它只认 HTTP_PROXY / HTTPS_PROXY 这两个环境变量。
解决办法是给 npm 单独配代理:
npm config set proxy http://127.0.0.1:7897
npm config set https-proxy http://127.0.0.1:7897
端口号换成你自己代理软件的。配完之后速度立刻正常了。
如果你没挂代理,用国内镜像源也可以:
npm config set registry https://registry.npmmirror.com
2. 目录别乱放
一开始项目建在 C 盘用户目录下,后来想挪到 D 盘。如果已经装完依赖再挪,node_modules 里有些包会因为路径问题出毛病,最省事的做法是挪完之后重新 npm install。
我是在装依赖之前挪的,所以没遇到这个问题。
现在的状态
站点能跑了,结构是这样:
/首页/blog文章列表/about关于页
加新文章只需要在 src/content/blog/ 里新建一个 .md 文件,开头写上标题、描述、日期,然后正常写正文就行。
接下来
内容才是最难的。技术上的门槛其实已经没了,剩下的是能不能持续写下去。
我打算先把折腾东西时遇到的问题都记下来——反正是给自己写备忘,顺便可能帮到别人。