目录
  1. 技术栈
  2. 怎么发新内容
  3. 从推特同步
  4. 本地预览

技术栈

  • Astro:静态站点生成器。文章用 Markdown 写,构建出来是纯静态页面,打开很快。
  • 零 UI 框架:没有 React,也没有 Tailwind,手写 CSS 变量,配色和字号尽量贴近 Apple 的设计规范。
  • 动效:首页动画是一个 seek(t) 纯函数,用闭式弹簧计算每个属性;页面切换用浏览器原生的 View Transitions。

怎么发新内容

所有内容都在 src/content/ 下面,新建一个 .md 文件就行:

想发什么 放在哪 必填字段
文章 src/content/posts/ title、description、date、category(ai / code / life)
提示词 src/content/prompts/ title、date、model,正文就是提示词原文
作品 src/content/works/ title、date、image、tool

图片放在 public/ 下面,引用时写 /works/xxx.jpg。

从推特同步

推特上发的长文、提示词和作品,运行一条命令就能同步过来:

npm run import:x

脚本会抓取公开推文,自动判断哪些是长文、哪些是提示词、哪些是作品,然后把图片和视频下载到本地,生成对应的 Markdown 文件。分错的推文在 scripts/x-import.config.json 里手动指定就行。

本地预览

npm run dev

打开 http://localhost:4321 就能看到效果,改了文件会自动刷新。