commit 0e18cc87909d145e5f09a0240aa21a6ece1db690 Author: zibright Date: Tue Jul 22 16:15:28 2025 +0800 初始化:创建基于 Nuxt Content 的博客项目 diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..d35441e --- /dev/null +++ b/.gitignore @@ -0,0 +1,37 @@ +# Nuxt dev/build outputs +.output +.data +.nuxt +.nitro +.cache +dist + +# Node dependencies +node_modules + +# Logs +logs +*.log +npm-debug.log* +yarn-debug.log* +yarn-error.log* +pnpm-debug.log* + +# System files +.DS_Store +Thumbs.db + +# Local env files +.env +.env.* +!.env.example + +# Editor directories and files +.idea +.vscode/* +!.vscode/extensions.json +*.suo +*.ntvs* +*.njsproj +*.sln +*.sw? diff --git a/README.md b/README.md new file mode 100644 index 0000000..3f4b841 --- /dev/null +++ b/README.md @@ -0,0 +1,67 @@ +# Nuxt Content 博客 + +这是一个使用 Nuxt 3 和 Nuxt Content 构建的博客系统。 + +## 功能特点 + +- 📝 基于 Markdown 的内容管理 +- 🎨 使用 TailwindCSS 构建的响应式设计 +- 🚀 基于 Nuxt 3 的快速渲染 +- 📋 自动生成文章列表 +- 📅 支持文章元数据(标题、描述、日期等) + +## 快速开始 + +### 安装依赖 + +```bash +pnpm install +``` + +### 启动开发服务器 + +```bash +pnpm dev +``` + +访问 http://localhost:3000 查看博客。 + +### 构建生产版本 + +```bash +pnpm build +``` + +## 添加新文章 + +在 `content` 目录下创建新的 `.md` 文件。文件需要包含以下格式的头部信息: + +```md +--- +title: 文章标题 +description: 文章描述 +date: YYYY-MM-DD +--- + +# 文章内容 +``` + +## 项目结构 + +``` +├── content/ # Markdown 文章 +├── components/ # Vue 组件 +├── layouts/ # 页面布局 +├── pages/ # 页面路由 +└── public/ # 静态资源 +``` + +## 技术栈 + +- [Nuxt 3](https://nuxt.com/) +- [Nuxt Content](https://content.nuxt.com/) +- [TailwindCSS](https://tailwindcss.com/) + +## 许可证 + +MIT diff --git a/content/welcome.md b/content/welcome.md new file mode 100644 index 0000000..e28ca8d --- /dev/null +++ b/content/welcome.md @@ -0,0 +1,32 @@ +--- +title: 欢迎来到我的博客 +description: 这是我的第一篇博客文章 +date: 2025-07-22 +--- + +# 欢迎来到我的博客 + +这是使用 Nuxt Content 构建的博客系统。你可以使用 Markdown 来编写文章,支持各种格式化功能。 + +## Markdown 功能展示 + +### 列表 +- 项目 1 +- 项目 2 +- 项目 3 + +### 代码块 +```js +const greeting = "Hello, World!"; +console.log(greeting); +``` + +### 引用 +> 这是一个引用文本的示例。 + +## 下一步 + +1. 添加更多文章 +2. 自定义样式 +3. 添加标签系统 +4. 实现搜索功能 diff --git a/layouts/default.vue b/layouts/default.vue new file mode 100644 index 0000000..5a5050b --- /dev/null +++ b/layouts/default.vue @@ -0,0 +1,17 @@ + diff --git a/nuxt.config.ts b/nuxt.config.ts new file mode 100644 index 0000000..844787d --- /dev/null +++ b/nuxt.config.ts @@ -0,0 +1,17 @@ +// https://nuxt.com/docs/api/configuration/nuxt-config +export default defineNuxtConfig({ + devtools: { enabled: true }, + modules: ['@nuxt/content', '@nuxtjs/tailwindcss'], + content: { + // https://content.nuxtjs.org/api/configuration + highlight: { + theme: 'github-dark' + }, + markdown: { + toc: { + depth: 3, + searchDepth: 3 + } + } + } +}) diff --git a/package.json b/package.json new file mode 100644 index 0000000..06e64d2 --- /dev/null +++ b/package.json @@ -0,0 +1,17 @@ +{ + "name": "nuxt-blog", + "private": true, + "type": "module", + "scripts": { + "build": "nuxt build", + "dev": "nuxt dev", + "generate": "nuxt generate", + "preview": "nuxt preview" + }, + "devDependencies": { + "@nuxt/content": "^2.12.0", + "@nuxt/devtools": "latest", + "@nuxtjs/tailwindcss": "^6.11.4", + "nuxt": "^3.10.0" + } +} diff --git a/pages/[...slug].vue b/pages/[...slug].vue new file mode 100644 index 0000000..b8a5fde --- /dev/null +++ b/pages/[...slug].vue @@ -0,0 +1,11 @@ + + +