NuxtAstroVue博客

nuxt-paper — Nuxt 博客模板

作者 alexanderop

把 AstroPaper 博客主题移植到 Nuxt 4 与 Nuxt Content v3 的开源模板,保留原主题的排版与功能,并提供静态生成能力。

看看你的网站会是什么样

浏览真实页面截图,比较内容排版与手机效果。点击下方缩略图切换,放大查看整页细节。

3 个预览视图
桌面端首页1 / 3
桌面端截图首屏预览

由服务器浏览器实际访问页面后截取。

全部页面与视图 3

截图用于了解视觉与布局,交互效果请以实际项目为准。

采集于 2026-10-01查看来源

值得关注的模板亮点

从已有项目资料中,快速了解它的特点。

01

AstroPaper v6 主题移植到 Nuxt 4 + Nuxt Content v3,保留原主题的排版与交互

02

内容用 Markdown 存放于 content/posts/,frontmatter 结构在 content.config.ts 中定义

03

搜索由 Pagefind 替换为 MiniSearch + queryCollectionSearchSections,RSS 与 sitemap 改由 Nitro 路由输出

04

支持草稿与定时发布(15 分钟余量),生产环境自动隐藏

05

包含分页文章列表、按标签分页、归档、关于页、模糊搜索与首页精选/最近区块

06

可通过 nuxt generate 生成静态站点,部署到任意静态托管

模板详细介绍

NuxtPaper 是 AstroPaper v6 博客主题在 Nuxt 生态下的移植版本,使用 Nuxt 4(Vue 3)与 @nuxt/content v3 构建内容层,样式沿用 Tailwind CSS v4 与 @tailwindcss/typography,字体通过 @nuxt/fonts 加载 Google Sans Code,代码高亮由 Nuxt Content 内置的 Shiki 完成,并保留原主题的 min-light / night-owl 主题。搜索从 Pagefind 换成 MiniSearch 配合 queryCollectionSearchSections,RSS 与 sitemap 改由 Nitro 服务端路由(/rss.xml、/sitemap.xml)输出。内容以 Markdown 文件放在 content/posts/ 下,frontmatter 结构定义在 content.config.ts,草稿通过 draft: true 标记;仓库附带 scripts/migrate-content.mjs 用于把原 AstroPaper 文章从 MDX 转成 MDC 并重写图片路径。站点元数据、功能开关、社交与分享链接集中在 shared/utils/site.ts,界面文案在 shared/utils/i18n.ts。

功能层面包含亮/暗模式(内联脚本避免闪烁并跟随系统偏好)、分页文章列表与按标签分页、标签页、按年/月分组的归档页、关于页、模糊搜索、首页的精选与最近文章区块、草稿与定时发布(15 分钟余量,生产环境隐藏)、阅读进度条、复制代码按钮、返回顶部、上一篇/下一篇导航、分享链接、编辑页面链接、面包屑、跳转到内容、RSS 与 sitemap,并可通过 nuxt generate 输出静态站点部署到任意静态托管。

限制方面,README 明确列出未移植项:文章标题与标签上的 view-transition names 没有迁移,仅通过 experimental.viewTransition 启用文档级过渡。演示博客文章沿用 AstroPaper 的原始内容,并非为 NuxtPaper 新写。模板本身为 MIT 许可,但演示图片、字体、图标等第三方素材需按各自许可单独核对。

NuxtAstro博客

适合你的项目吗?

适用场景

  • 用 Nuxt 4 搭建个人技术博客,并希望沿用 AstroPaper 的排版风格
  • 需要 Markdown 内容、标签、归档、RSS 与 sitemap 的静态博客站点
  • 从 AstroPaper 迁移到 Nuxt,希望复用已有文章内容与主题外观
  • 需要亮/暗模式、阅读进度条、复制代码按钮等阅读体验功能的博客

适合人群

  • 熟悉 Nuxt 与 Vue 3、愿意自行维护模板代码的开发者
  • 以 Markdown 写作、偏好静态生成部署的博客作者
  • 需要标签、归档、搜索与 RSS 等基础博客能力的站点

上手与定制指南

结合仓库当前版本的说明,按下面的资料检查内容、配置与运行要求。

  1. 1

    使用 pnpm install 安装依赖,pnpm dev 启动本地开发(默认 http://localhost:3000)

  2. 2

    pnpm generate 生成静态站点,输出位于 .output/public

  3. 3

    站点元数据、功能开关、社交与分享链接在 shared/utils/site.ts 中配置,界面文案在 shared/utils/i18n.ts

  4. 4

    文章为 content/posts/ 下的 Markdown 文件,草稿用 draft: true 标记,frontmatter 结构见 content.config.ts

  5. 5

    仓库提供 scripts/migrate-content.mjs,用于把原 AstroPaper 文章从 MDX 转为 MDC 并重写图片路径

查看仓库使用说明

授权与来源资料

使用条件与限制

免费使用 · 保留许可声明

本次收录的是公开仓库中采用 MIT 许可的免费版本;免费范围为该版本代码,不代表外部服务或第三方素材免费。

使用时需要遵守

  • 允许免费使用、修改、商用和分发该版本代码。
  • 分发代码副本或实质性部分时,保留原作者版权声明和完整 MIT 许可声明。
  • 代码按现状提供;担保与责任限制以原许可证及适用法律为准。

额外费用与待核对事项

  • 演示博客文章沿用 AstroPaper 的原始内容,并非为 NuxtPaper 新写;若用于正式站点,需自行替换或确认这些示例文章内容的可用性。
  • 文章标题与标签上的 view-transition names 未移植,仅通过 experimental.viewTransition 启用文档级过渡,因此无法获得原主题中针对标题/标签的细粒度视图过渡效果。
  • 演示图片、字体、图标及其他第三方素材需按各自许可核对,不能仅凭代码的 MIT 许可判断。
  • 域名、托管、数据库、支付或 AI 等外部服务可能另外收费。
查看原文依据

Permission is hereby granted, free of charge

许可证原文

The demo blog posts are AstroPaper's original content.

README 原文

View-transition names on post titles/tags (document-level transitions are enabled via `experimental.viewTransition`)

README 原文
https://github.com/alexanderop/nuxt-paper/blob/main/LICENSEhttps://github.com/alexanderop/nuxt-paper/blob/main/README.md

DeepSeek 根据仓库许可证和 README 整理 ·2026-10-01。结果仅覆盖已读取资料,依赖、图片、字体及后续条款变更以各自原文为准。

项目核对记录与介绍依据

模板资料

来源平台
GitHub
资料与维护参考分
资料较完整 · 85 / 100
技术栈
Nuxt · Astro · Vue
网站类型
博客
这个分数如何计算

本站按许可资料(最高30分)、演示链接(12分)、预览图(10分)、Star数(15分)、记录的维护时间(15分)、描述完整度(8分)、功能记录(5分)和分类资料(5分)计算。它不是代码、安全或性能测试,也不是 Google 评分;有链接不代表已实测可用。

这个项目需要核对什么

记录的仓库更新时间
2026-06-14
截图检查日期
2026-10-01

已收录演示链接。请用你的内容与屏幕尺寸检查;有演示不代表表单、认证或支付已经可用。

目录记录的主要技术栈是 Nuxt。请通过依赖清单和锁文件核对实际版本与托管要求。这些说明基于收录资料,不代表代码审计或部署实测。

查看具体选型方法 →

介绍的制作与核对状态

介绍由 AI 辅助整理目录与仓库资料。仓库作者不等于这篇介绍的审核者。

已完成服务器许可规则与 AI 来源核对;未经过人工编辑审核。

查看当时使用的来源资料

SHA-256: 918f0c964df41c82785bc92d253dedcb5970b0a6dba201c48c81609dcc5793e5

2026-10-01T00:23:34.416Z

来源文件 / 仓库
# NuxtPaper

A port of [AstroPaper](https://github.com/satnaing/astro-paper) (v6) — a minimal,
responsive, accessible and SEO-friendly blog theme — to **Nuxt 4** and
**Nuxt Content v3**.

## Stack

| Concern        | AstroPaper                  | NuxtPaper                                |
| -------------- | --------------------------- | ---------------------------------------- |
| Framework      | Astro 6                     | Nuxt 4 (Vue 3)                           |
| Content        | Astro content collections   | @nuxt/content v3 (`content.config.ts`)   |
| Styling        | Tailwind CSS v4             | Tailwind CSS v4 (`@tailwindcss/vite`)    |
| Typography     | @tailwindcss/typography     | @tailwindcss/typography                  |
| Fonts          | Astro fonts (Google)        | @nuxt/fonts (Google Sans Code)           |
| Search         | Pagefind                    | MiniSearch + `queryCollectionSearchSections` |
| Code highlight | Shiki (min-light/night-owl) | Shiki via Nuxt Content (same themes)     |
| Callouts       | rehype-callouts             | rehype-callouts (obsidian theme)         |
| TOC            | remark-toc                  | remark-toc                               |
| RSS / Sitemap  | @astrojs/rss + sitemap      | Nitro server routes (`/rss.xml`, `/sitemap.xml`) |

## Features

- Light/dark mode with FOUC-free inline theme script and OS-preference sync
- Paginated post list (`/posts`, `/posts/2`, …) and per-tag pagination
- Tags, archives (grouped by year/month), about page, fuzzy search
- Featured/recent sections on the home page
- Draft posts and scheduled publishing (15-min margin), hidden in production
- Reading progress bar, copy-code buttons, back-to-top, prev/next post nav
- Share links, edit-page link, breadcrumbs, skip-to-content, RSS + sitemap
- Full SSG via `nuxt generate` (deployable to any static host)

## Setup

```bash
pnpm install
pnpm dev        # http://localhost:3000
pnpm generate   # static build in .output/public
```

## Configuration

Site metadata, feature flags, socials and share links live in
`shared/utils/site.ts` (the equivalent of `astro-paper.config.ts`).
UI strings live in `shared/utils/i18n.ts`.

## Content

Posts are markdown files in `content/posts/` (drafts: `draft: true`).
Frontmatter schema is defined in `content.config.ts`. The original AstroPaper
posts were migrated with `scripts/migrate-content.mjs` (MDX → MDC conversion,
slug-based file names, image path rewrites).

## License & credits

MIT — this is a port of [AstroPaper](https://github.com/satnaing/astro-paper)
by [Sat Naing](https://satna.ing), whose original MIT copyright notice is
retained in [LICENSE](./LICENSE). The demo blog posts are AstroPaper's
original content.

## Not ported

- View-transition names on post titles/tags (document-level transitions are
  enabled via `experimental.viewTransition`)
反馈内容错误

看看同类模板

对比同技术栈与用途的模板,找到更适合的视觉与内容结构。