CloudProxy Pro

一个专业的AWS云解决方案网站，使用Nuxt 3构建，支持多语言国际化。

🌟 项目特性

• 现代化技术栈: 基于 Nuxt 3 + Vue 3 + TypeScript
• 多语言支持: 支持英语、简体中文、繁体中文
• 响应式设计: 使用 Tailwind CSS 构建的现代化UI
• SEO优化: 内置站点地图、robots.txt和SEO元数据
• 内容管理: 使用 Nuxt Content 进行博客内容管理
• 静态生成: 支持SSG（静态站点生成）

🚀 技术栈

• 框架: Nuxt 3
• UI库: Tailwind CSS + Headless UI
• 图标: Heroicons
• 国际化: @nuxtjs/i18n
• 内容管理: @nuxt/content
• SEO: @nuxtjs/sitemap + @nuxtjs/robots
• 开发工具: Nuxt DevTools

📁 项目结构

web7-published/
├── content/                 # 博客内容
│   ├── en/                 # 英文内容
│   ├── zh/                 # 简体中文内容
│   └── zh-hant/            # 繁体中文内容
├── layouts/                # 布局组件
├── locales/                # 国际化语言文件
├── pages/                  # 页面路由
│   ├── blog/               # 博客页面
│   ├── contact.vue         # 联系页面
│   ├── pricing.vue         # 价格页面
│   └── solutions.vue       # 解决方案页面
├── public/                 # 静态资源
├── nuxt.config.ts          # Nuxt配置
└── tailwind.config.js      # Tailwind配置

🛠️ 开发环境设置

前置要求

• Node.js 18+
• npm 或 yarn

安装依赖

npm install

开发服务器

npm run dev

访问 http://localhost:3000 查看网站。

构建生产版本

# 构建静态站点
npm run generate

# 构建SSR应用
npm run build

预览生产版本

npm run preview

🌐 多语言支持

项目支持以下语言：

• 英语 (en) - 默认语言
• 简体中文 (zh)
• 繁体中文 (zh-hant)

语言文件位于 locales/ 目录下，内容文件位于 content/ 目录下对应的语言文件夹中。

📝 内容管理

添加博客文章

1. 在 content/ 目录下选择对应语言文件夹
2. 创建新的 Markdown 文件
3. 在文件头部添加frontmatter：

---
title: "文章标题"
description: "文章描述"
date: "2024-01-15"
tags: ["标签1", "标签2"]
image: "/images/blog/article.jpg"
slug: "article-slug"
---

更新翻译

1. 编辑 locales/ 目录下对应的语言文件
2. 添加或修改翻译键值对
3. 在组件中使用 $t('key') 调用翻译

🎨 样式定制

项目使用 Tailwind CSS 进行样式管理：

• 配置文件：tailwind.config.js
• 主要样式类在组件中定义
• 支持响应式设计和暗色模式

🔧 配置说明

Nuxt 配置 (nuxt.config.ts)

• 国际化: 配置多语言支持和语言检测
• SEO: 站点地图和robots.txt配置
• 模块: 启用的Nuxt模块列表
• SSG: 静态站点生成配置

环境变量

创建 .env 文件来配置环境变量：

# 站点URL
NUXT_PUBLIC_SITE_URL=https://cloudproxy-pro.com

# 其他配置...

📱 页面说明

• 首页 (/): 展示主要特性和服务介绍
• 解决方案 (/solutions): AWS云服务解决方案详情
• 价格 (/pricing): 服务定价方案
• 博客 (/blog): 技术文章和新闻
• 联系我们 (/contact): 联系表单和联系信息

🚀 部署

静态部署

npm run generate

生成的文件在 dist/ 目录，可以部署到任何静态托管服务。

服务器部署

npm run build
npm run preview

📞 联系信息

• Telegram: @pinnovatecloud
• WhatsApp: +1 9174029875
• 网站: https://cloudproxy-pro.com

📄 许可证

本项目为私有项目，版权所有 © 2024 CloudProxy Pro。

🤝 贡献

如需贡献代码或报告问题，请联系开发团队。

---

CloudProxy Pro - 为现代企业提供专业的AWS云解决方案