NuxtVue作品集博客

nuxtedomoon — Nuxt 作品集模板

作者 khatastroffik

基于 Nuxt、Nuxt Content、Tailwind CSS 与 daisyUI 构建的作品集/博客静态站点模板，含首页、文章、项目、技巧与关于等页面，并内置明暗主题切换。

打开源站下载源码 ZIP

看看你的网站会是什么样

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

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

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

全部页面与视图 3

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

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

值得关注的模板亮点

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

01

使用 Nuxt、Nuxt Content、Tailwind CSS 与 daisyUI 构建的响应式作品集/博客模板

02

包含首页、articles、projects、crumbs、about 等页面板块

03

提供可自定义的明暗主题及切换功能，并针对博客富文本调整排版

04

内置面包屑（含复制链接）与上一页/下一页导航

05

集成自动 SEO 相关能力（schema.org、og 图片、robots.txt、链接检查）并使用 nuxt-image 管理媒体

06

生成静态站点，可部署到 GitHub Pages 等简单静态环境

模板详细介绍

Nuxtedo-Moon 是一个使用 Nuxt、Nuxt Content、Tailwind CSS 和 daisyUI 构建的响应式作品集/博客静态网页模板。项目通过 Nuxt Content 管理内容，页面结构覆盖首页（含 Hero、Stats 等组件）、articles（博客）、projects（已完成或进行中的项目与贡献）、crumbs（技巧与代码片段）以及 about（个人简介与履历）等板块。模板提供可自定义的明暗主题及切换功能，并针对博客类富文本内容调整了排版样式。导航方面包含面包屑（附带复制链接到剪贴板功能）与上一页/下一页切换。项目还集成了自动 SEO 相关能力（schema.org、og 图片、robots.txt、链接检查等），并使用 nuxt-image 管理图片与媒体资源。

该项目在 README 中明确标注为 work-in-progress，部分功能尚未完成，包括长页面的目录（Table-of-Content）、全局文本搜索、页面标签/主题分配与筛选、文章阅读时间、Nuxt Studio 浏览器内内容编辑集成、JSON-resume 集成，以及作品集与所有者数据的简易配置。因此它更适合作为静态作品集/博客的起点，而非功能完备的成品。

模板生成的是静态站点，可部署到 GitHub Pages 及其他简单的静态服务器环境。仓库附带 GitHub Actions 部署工作流，演示站会定期更新。代码采用 MIT 许可，可免费使用、修改、商用与分发，但演示图片、字体、图标等第三方素材需单独核对许可，域名、托管等外部服务可能另行收费。

Nuxt作品集博客

适合你的项目吗？

适用场景

  • 搭建个人作品集网站，展示项目与个人简介
  • 创建以 Markdown 内容驱动的博客，发布文章与代码片段
  • 需要一个带明暗主题切换与面包屑导航的静态站点起点
  • 将站点部署到 GitHub Pages 等静态托管环境

适合人群

  • 希望用 Nuxt 与 Nuxt Content 快速起步个人作品集或博客的开发者
  • 偏好 Tailwind CSS 与 daisyUI 样式体系的前端开发者
  • 需要静态输出并部署到 GitHub Pages 的个人项目
  • 接受项目处于开发中状态、愿意按需补充功能的用户

上手与定制指南

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

  1. 1

    克隆仓库后使用 pnpm install 安装依赖

  2. 2

    使用 pnpm dev 在 http://localhost:3000 启动开发服务器

  3. 3

    使用 pnpm build 构建生产版本，pnpm preview 本地预览生产构建

  4. 4

    项目 README 标注为 work-in-progress，部分功能（目录、全局搜索、标签筛选、阅读时间等）尚未完成

  5. 5

    演示图片、字体、图标等第三方素材需按各自许可核对，域名与托管等外部服务可能另行收费

查看仓库使用说明

授权与来源资料

使用条件与限制

免费使用 · 保留许可声明

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

使用时需要遵守

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

额外费用与待核对事项

  • 演示图片、字体、图标及其他第三方素材需按各自许可核对，不能仅凭代码的 MIT 许可判断。
  • 域名、托管、数据库、支付或 AI 等外部服务可能另外收费。
  • 项目当前处于开发中状态，README 明确标注为 work-in-progress，部分功能尚未完成，使用前需自行评估完整性。
  • 长页面的目录（Table-of-Content）功能尚未实现，README 中以未勾选复选框标注。
  • 全局文本搜索功能尚未实现，README 中以未勾选复选框标注。
  • 页面标签/主题分配及对应筛选功能尚未实现，README 中以未勾选复选框标注。
  • 文章阅读时间功能尚未实现，README 中以未勾选复选框标注。
  • Nuxt-Studio 浏览器内内容编辑集成尚未实现，且需在 dev 模式下运行，因为部署页面为静态。
  • JSON-resume 集成尚未实现，README 中标注为可选且未勾选。
  • 作品集与所有者数据的简易配置功能尚未实现，README 中以未勾选复选框标注。
查看原文依据

Permission is hereby granted, free of charge

许可证原文

This project is currently **work-in-progress**.

README 原文

- [ ] "_Table-of-Content_" on comprehensive pages

README 原文

- [ ] Global "_text search_" functionality

README 原文

- [ ] "_tags/topics_" assignment to specify the content of pages & a corresponding "_filter_" functionality

README 原文

- [ ] "_reading time_" for articles

README 原文

- [ ] Integration of Nuxt-Studio to create and edit content files directly in the browser (while running the nuxt app in "_dev mode_", since the deployed page is static)

README 原文

- [ ] Integration of "_JSON-resume_" (optional?) to provide rich data to the "_projects_" and "_about_" sections

README 原文

- [ ] Simple configuration of portfolio and owner specific data

README 原文
https://github.com/khatastroffik/nuxtedomoon/blob/main/LICENSEhttps://github.com/khatastroffik/nuxtedomoon/blob/main/README.md

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

项目核对记录与介绍依据

模板资料

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

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

这个项目需要核对什么

记录的仓库更新时间
2026-04-25
截图检查日期
2026-10-13

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

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

查看具体选型方法 →

介绍的制作与核对状态

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

审核声明: [email protected] · 2026-10-13

查看当时使用的来源资料

SHA-256: 99cf5692bd17f9018dd510501ea56f261cb411b197043d97ddddd4e9c68ef9ca

2026-10-13T08:50:05.109Z

来源文件 / 仓库
# Nuxtedo-Moon

**Nuxtedo-Moon** is a responsive _portfolio/blog static web page template_ designed using Nuxt, Nuxt-Content, Tailwind CSS and daisyUI.

![screenshot of the portfolio landing page](./docs/nuxtedomoon.webp)

<p align="center">
<img src="https://img.shields.io/github/package-json/dependency-version/khatastroffik/nuxtedomoon/nuxt/main?style=flat&logo=nuxt&labelColor=black" alt="Nuxt Version">
&nbsp;&nbsp;<img src="https://img.shields.io/github/package-json/dependency-version/khatastroffik/nuxtedomoon/%40nuxt%2Fcontent/main?style=flat&logo=nuxt&labelColor=black" alt="Nuxt Content Version">
&nbsp;&nbsp;<img src="https://img.shields.io/github/package-json/dependency-version/khatastroffik/nuxtedomoon/%40nuxtjs%2Fseo/main?style=flat&logo=nuxt&labelColor=black" alt="Nuxt SEO version">
&nbsp;&nbsp;<img src="https://img.shields.io/github/package-json/dependency-version/khatastroffik/nuxtedomoon/tailwindcss/main?style=flat&logo=tailwindcss&labelColor=black" alt=""Tailwindcss Version>
</p>

<p align="center">
<img src="https://img.shields.io/github/package-json/dependency-version/khatastroffik/nuxtedomoon/daisyui/main?style=flat&logo=daisyui&labelColor=black" alt="DaisyUI Version">
&nbsp;&nbsp;<img src="https://img.shields.io/github/package-json/dependency-version/khatastroffik/nuxtedomoon/dev/typescript?logo=typescript&logoColor=yellow&labelColor=black" alt="TypeScript Version">
&nbsp;&nbsp;<img src="https://img.shields.io/github/package-json/dependency-version/khatastroffik/nuxtedomoon/dev/eslint?logo=eslint&logoColor=yellow&labelColor=black" alt="ESlint Version">
&nbsp;&nbsp;<img src="https://img.shields.io/github/license/khatastroffik/nuxtedomoon?style=flat&labelColor=black&color=darkblue" alt="License">
</p>

## Demo

A regularly actualized **demo portfolio web page** is available here: [Demo](https://khatastroffik.github.io/nuxtedomoon/)

The deployment state is documented here: [Deployment Log](https://github.com/khatastroffik/nuxtedomoon/actions/workflows/deploy-nuxt-static-site.yml)

## Features Overview

This project is currently **work-in-progress**.
Feel free to have a look at the [project development board](https://github.com/users/khatastroffik/projects/4).

- [x] Generates a "_static_" site which is compatible with **GitHub-Page** and further "simple" server deployments
- [x] Responsive design!
- [x] Landing page to promote the "_portfolio_" (Hero, Stats... components)
- [x] Further Sections: _articles_ (blog), _projects_ (selection of achieved or wip projects and contributions), _crumbs_ (tipp'n tricks, small code pieces) and _about_ (profile, curriculum)
- [x] Customized (and easily adaptable) dark and light "_themes_" incl. toggle function
- [x] Prose adapted "_typography_" suitable for blog i.e. rich content rendering
- [x] "_breadcrumbs_" (incl. "_copy link to clipboard_" function) and "_prev/next page_" navigation
- [x] Automatic **SEO** (schema.org, og-images, robots.txt, link checker etc.) and ~100% lighthouse score
- [x] Fancy MDC (markdown components) &amp; web parts like _Quote-Of-The-Day_, _unscrambling_ text
- [x] Optimized image/media management using nuxt-image
- [ ] "_Table-of-Content_" on comprehensive pages
- [ ] Global "_text search_" functionality
- [ ] "_tags/topics_" assignment to specify the content of pages &amp; a corresponding "_filter_" functionality
- [ ] "_reading time_" for articles
- [ ] Integration of Nuxt-Studio to create and edit content files directly in the browser (while running the nuxt app in "_dev mode_", since the deployed page is static)
- [ ] Integration of "_JSON-resume_" (optional?) to provide rich data to the "_projects_" and "_about_" sections
- [ ] Simple configuration of portfolio and owner specific data
- [ ] ... more to come ...

## Nuxt Standard Information

### Installation

Make sure to install dependencies after cloning the original repository locally:

```bash
pnpm install
```

### Development Server

Start the development server on `http://localhost:3000`:

```bash
pnpm dev
```

### Production

Build the application for production:

```bash
pnpm build
```

Locally preview production build:

```bash
pnpm preview
```

## Sources &amp; Know-How

- Look at the [Nuxt documentation](https://nuxt.com/docs/getting-started/introduction) to learn more.
- Check out the [deployment documentation](https://nuxt.com/docs/getting-started/deployment) for more information.
反馈内容错误

看看同类模板

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

canvas

canvas

Portfolio template made with Nuxt 3, Nuxt Content v3, NuxtUI v3 and TailwindCSS v4

Nuxt · 作品集

alpine-theme

alpine-theme

Alpine 是一个以极简为设计核心的博客主题，基于 Nuxt 与 Nuxt Content 构建。 它的特别之处在于，你可以从一个简单的个人资料页开始，逐步扩展成一个完整的博客。

Nuxt · 博客

portfolio

portfolio

Nuxt Portfolio Template made with Nuxt UI and Nuxt Content.

Nuxt · 作品集

bael-template

bael-template

Brutalist Blog theme for Netlify CMS

Nuxt · 博客

bloggrify

bloggrify

Run a blog from Markdown files. Themes, SEO, analytics, newsletter and comments preconfigured. Like Docus, but…

Nuxt · 博客

nuxtjs-tailwindcss-portfolio

nuxtjs-tailwindcss-portfolio

Nuxt.js & Tailwind CSS version of the portfolio project.

Nuxt · 作品集