2 分钟阅读
Astro Sphere

Astro Sphere Lighthouse Score

Astro Sphere 是一个源自作者个人网站的静态作品集与博客主题,强调极简和轻量。

它主要使用 Astro、Tailwind 和 TypeScript 构建,只在少量需要状态的组件里使用了 SolidJS。

🚀 自己部署

📋 特性

  • ✅ 100 / 100 Lighthouse 性能评分
  • ✅ 响应式布局
  • ✅ 可访问性友好
  • ✅ SEO 友好
  • ✅ 完整类型安全
  • ✅ 极简风格
  • ✅ 浅色 / 深色主题
  • ✅ 轻量动画
  • ✅ Tailwind 样式体系
  • ✅ 自动生成站点地图
  • ✅ 自动生成 RSS
  • ✅ 支持 Markdown
  • ✅ 支持 MDX(可在内容中嵌入组件)
  • ✅ 支持搜索文章和项目

💯 Lighthouse 评分

Astro Sphere Lighthouse Score

🕊️ 轻量

所有页面体积都控制在 100KB 以内(包含字体)

⚡︎ 快速

本地渲染大约 40ms

📄 配置方式

示例博客文章本身就承担了文档和配置说明的作用。

💻 常用命令

所有命令都在项目根目录执行:

你也可以把 npm 替换成自己习惯的包管理器,例如 pnpmyarnbun

命令作用
npm install安装依赖
npm run devlocalhost:4321 启动本地开发环境
npm run sync生成 Astro 模块的 TypeScript 类型
npm run build构建生产版本到 ./dist/
npm run preview本地预览构建结果
npm run astro ...执行 astro addastro check 等 CLI 命令
npm run astro -- --help查看 Astro CLI 帮助
npm run lint执行 ESLint
npm run lint:fix自动修复 ESLint 问题

🏛️ 协议

MIT