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云解决方案
|