186 lines
4.1 KiB
Markdown
186 lines
4.1 KiB
Markdown
# 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
|
||
|
||
### 安装依赖
|
||
|
||
```powershell
|
||
npm install
|
||
```
|
||
|
||
### 开发服务器
|
||
|
||
```powershell
|
||
npm run dev
|
||
```
|
||
|
||
访问 [http://localhost:3000](http://localhost:3000) 查看网站。
|
||
|
||
### 构建生产版本
|
||
|
||
```powershell
|
||
# 构建静态站点
|
||
npm run generate
|
||
|
||
# 构建SSR应用
|
||
npm run build
|
||
```
|
||
|
||
### 预览生产版本
|
||
|
||
```powershell
|
||
npm run preview
|
||
```
|
||
|
||
## 🌐 多语言支持
|
||
|
||
项目支持以下语言：
|
||
|
||
- **英语** (en) - 默认语言
|
||
- **简体中文** (zh)
|
||
- **繁体中文** (zh-hant)
|
||
|
||
语言文件位于 `locales/` 目录下，内容文件位于 `content/` 目录下对应的语言文件夹中。
|
||
|
||
## 📝 内容管理
|
||
|
||
### 添加博客文章
|
||
|
||
1. 在 `content/` 目录下选择对应语言文件夹
|
||
2. 创建新的 Markdown 文件
|
||
3. 在文件头部添加frontmatter：
|
||
|
||
```yaml
|
||
---
|
||
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` 文件来配置环境变量：
|
||
|
||
```env
|
||
# 站点URL
|
||
NUXT_PUBLIC_SITE_URL=https://cloudproxy-pro.com
|
||
|
||
# 其他配置...
|
||
```
|
||
|
||
## 📱 页面说明
|
||
|
||
- **首页** (`/`): 展示主要特性和服务介绍
|
||
- **解决方案** (`/solutions`): AWS云服务解决方案详情
|
||
- **价格** (`/pricing`): 服务定价方案
|
||
- **博客** (`/blog`): 技术文章和新闻
|
||
- **联系我们** (`/contact`): 联系表单和联系信息
|
||
|
||
## 🚀 部署
|
||
|
||
### 静态部署
|
||
|
||
```powershell
|
||
npm run generate
|
||
```
|
||
|
||
生成的文件在 `dist/` 目录，可以部署到任何静态托管服务。
|
||
|
||
### 服务器部署
|
||
|
||
```powershell
|
||
npm run build
|
||
npm run preview
|
||
```
|
||
|
||
## 📞 联系信息
|
||
|
||
- **Telegram**: @pinnovatecloud
|
||
- **WhatsApp**: +1 9174029875
|
||
- **网站**: https://cloudproxy-pro.com
|
||
|
||
## 📄 许可证
|
||
|
||
本项目为私有项目，版权所有 © 2024 CloudProxy Pro。
|
||
|
||
## 🤝 贡献
|
||
|
||
如需贡献代码或报告问题，请联系开发团队。
|
||
|
||
---
|
||
|
||
**CloudProxy Pro** - 为现代企业提供专业的AWS云解决方案
|