logo
0
0
Login

Nuxt 4 博客

这是一个基于 Nuxt 4 和 Vue 3 构建的现代化博客应用。

功能特性

  • 🏠 首页 - 介绍博客和功能特性
  • 📝 文章页 - 文章列表和文章详情页
  • 📱 响应式设计 - 适配各种设备
  • 快速加载 - 基于 Nuxt 4 的性能优化
  • 🎨 现代化 UI - 使用 Tailwind CSS

技术栈

  • 框架: Nuxt 4
  • 前端: Vue 3
  • 样式: Tailwind CSS
  • 内容: @nuxt/content
  • 图片: @nuxt/image

开始使用

安装依赖

npm install

开发模式

npm run dev

构建生产版本

npm run build

预览生产版本

npm run preview

项目结构

├── assets/ │ └── css/ │ └── main.css ├── layouts/ │ └── default.vue ├── pages/ │ ├── index.vue # 首页 │ └── posts/ │ ├── index.vue # 文章列表页 │ └── [slug].vue # 文章详情页 ├── app.vue ├── nuxt.config.ts ├── tailwind.config.js └── package.json

页面说明

首页 (/)

  • 博客介绍和欢迎信息
  • 功能特性展示
  • 关于博客的详细信息

文章列表页 (/posts)

  • 显示所有博客文章
  • 当前为空状态,等待内容添加

文章详情页 (/posts/[slug])

  • 显示单篇文章内容
  • 当前为占位页面,等待内容添加

开发说明

这个博客应用目前处于初始阶段,文章页面暂时无内容。后续可以:

  1. 添加 Markdown 格式的文章内容
  2. 集成内容管理系统
  3. 添加评论功能
  4. 实现搜索功能
  5. 添加标签和分类

许可证

MIT

About

个人博客

Language
JavaScript94.1%
Vue5.2%
Shell0.4%
TypeScript0.2%
Others0.1%