基于 Astro 开发的静态博客模板。
🖥️在线预览(Vercel) / 🌏English README / 🌏日本語 README / 📦旧 Hexo 版本
- 基于 Astro 和 Tailwind CSS 开发
- 流畅的动画和页面过渡
- 亮色 / 暗色模式
- 自定义主题色和横幅图片
- 响应式设计
- 评论
- 搜索
- 文内目录
- 使用此模板生成新仓库或 Fork 此仓库
- 进行本地开发,Clone 新的仓库,执行
pnpm install
和pnpm add sharp
以安装依赖- 若未安装 pnpm,执行
npm install -g pnpm
- 若未安装 pnpm,执行
- 通过配置文件
src/config.ts
自定义博客 - 执行
pnpm new-post <filename>
创建新文章,并在src/content/posts/
目录中编辑 - 参考官方指南将博客部署至 Vercel, Netlify, GitHub Pages 等;部署前需编辑
astro.config.mjs
中的站点设置。
---
title: My First Blog Post
published: 2023-09-09
description: This is the first post of my new Astro blog.
image: /images/cover.jpg
tags: [Foo, Bar]
category: Front-end
draft: false
---
下列指令均需要在项目根目录执行:
Command | Action |
---|---|
pnpm install 并 pnpm add sharp |
安装依赖 |
pnpm dev |
在 localhost:4321 启动本地开发服务器 |
pnpm build |
构建网站至 ./dist/ |
pnpm preview |
本地预览已构建的网站 |
pnpm new-post <filename> |
创建新文章 |
pnpm astro ... |
执行 astro add , astro check 等指令 |
pnpm astro --help |
显示 Astro CLI 帮助 |