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

安装依赖

# 使用 npm
npm install

# 使用 pnpm
pnpm install

# 使用 yarn
yarn install

# 使用 bun
bun install

启动开发服务器

# 使用 npm
npm run dev

# 使用 pnpm
pnpm dev

# 使用 yarn
yarn dev

# 使用 bun
bun run dev

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

🏗️ 构建和部署

构建生产版本

# 使用 npm
npm run build

# 使用 pnpm
pnpm build

# 使用 yarn
yarn build

# 使用 bun
bun run build

预览生产构建

# 使用 npm
npm run preview

# 使用 pnpm
pnpm preview

# 使用 yarn
yarn preview

# 使用 bun
bun run preview

生成静态站点

# 使用 npm
npm run generate

# 使用 pnpm
pnpm generate

# 使用 yarn
yarn generate

# 使用 bun
bun run generate

🌍 多语言配置

项目支持三种语言：

• 英语 (en)
• 简体中文 (zh-hans)
• 繁体中文 (zh-hant)

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

📝 内容管理

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

---
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 官方文档。