# ClueFlare - 专业云服务代理平台

ClueFlare 是一个现代化的云服务代理平台，帮助用户轻松连接和访问世界级云服务提供商，包括 AWS、阿里云、腾讯云等。网站采用 Nuxt 3 构建，支持多语言国际化，提供响应式设计和优秀的用户体验。

## ✨ 主要特性

- 🌐 **多语言支持** - 支持英语、简体中文、繁体中文
- 📱 **响应式设计** - 完美适配桌面端和移动端
- 🎨 **现代化UI** - 基于 Tailwind CSS 的美观界面
- 📝 **内容管理** - 集成 Nuxt Content 的博客系统
- 🔍 **SEO优化** - 内置 SEO 优化和元数据管理
- ⚡ **高性能** - 基于 Nuxt 3 的快速加载体验
- 💬 **在线客服** - 集成 ChatWay 客服系统

## 🚀 技术栈

- **框架**: Nuxt 3
- **前端**: Vue 3 + TypeScript
- **样式**: Tailwind CSS
- **国际化**: @nuxtjs/i18n
- **内容管理**: @nuxt/content
- **SEO**: @nuxtjs/seo
- **构建工具**: Vite

## 📁 项目结构

```
cloudsphere/
├── assets/                 # 静态资源
│   └── css/
│       └── main.css       # 全局样式
├── components/            # Vue 组件
│   ├── ContactForm.vue    # 联系表单
│   ├── Footer.vue         # 页脚组件
│   ├── Header.vue         # 头部组件
│   └── LanguageSwitcher.vue # 语言切换器
├── content/               # 内容文件
│   ├── en/               # 英文内容
│   ├── zh-hans/          # 简体中文内容
│   └── zh-hant/          # 繁体中文内容
├── i18n/                 # 国际化配置
│   └── locales/          # 语言文件
├── layouts/              # 布局文件
│   └── default.vue       # 默认布局
├── pages/                # 页面文件
│   ├── blog/             # 博客页面
│   ├── about.vue         # 关于页面
│   ├── contact.vue       # 联系页面
│   └── index.vue         # 首页
├── public/               # 公共静态文件
├── nuxt.config.ts        # Nuxt 配置文件
└── package.json          # 项目依赖
```

## 🛠️ 开发环境设置

### 环境要求

- Node.js >= 18.0.0
- npm, pnpm, yarn 或 bun

### 安装依赖

```powershell
# 使用 npm
npm install

# 使用 pnpm
pnpm install

# 使用 yarn
yarn install

# 使用 bun
bun install
```

### 启动开发服务器

```powershell
# 使用 npm
npm run dev

# 使用 pnpm
pnpm dev

# 使用 yarn
yarn dev

# 使用 bun
bun run dev
```

开发服务器将在 `http://localhost:3000` 启动。

## 🏗️ 构建和部署

### 构建生产版本

```powershell
# 使用 npm
npm run build

# 使用 pnpm
pnpm build

# 使用 yarn
yarn build

# 使用 bun
bun run build
```

### 预览生产构建

```powershell
# 使用 npm
npm run preview

# 使用 pnpm
pnpm preview

# 使用 yarn
yarn preview

# 使用 bun
bun run preview
```

### 生成静态站点

```powershell
# 使用 npm
npm run generate

# 使用 pnpm
pnpm generate

# 使用 yarn
yarn generate

# 使用 bun
bun run generate
```

## 🌍 多语言配置

项目支持三种语言：
- 英语 (en)
- 简体中文 (zh-hans)
- 繁体中文 (zh-hant)

语言文件位于 `i18n/locales/` 目录下，内容文件位于 `content/` 目录下。

## 📝 内容管理

博客文章使用 Markdown 格式编写，存储在 `content/` 目录下。每篇文章需要包含以下前置元数据：

```yaml
---
title: "文章标题"
description: "文章描述"
date: "2024-01-15"
slug: "article-slug"
locale: "zh-hans"
---
```

## 🎨 样式定制

项目使用 Tailwind CSS 进行样式管理。全局样式文件位于 `assets/css/main.css`，可以通过修改 Tailwind 配置来自定义主题。

## 📱 响应式设计

网站采用移动优先的响应式设计，确保在各种设备上都有良好的用户体验。

## 🔧 开发工具

项目集成了以下开发工具：
- Nuxt DevTools - 开发调试工具
- TypeScript - 类型安全
- ESLint - 代码质量检查
- Prettier - 代码格式化

## 📄 许可证

本项目为私有项目，版权所有。

## 🤝 贡献

如果您想为项目做出贡献，请先联系项目维护者。

## 📞 联系我们

- **Telegram**: @pinnovatecloud
- **WhatsApp**: +1 9174029875
- **网站**: http://clueflare.com

---

更多信息请参考 [Nuxt 官方文档](https://nuxt.com/docs/getting-started/introduction)。