adu/child-learning

Fork 0

Files

guoyoudu 0c220d3fe2 new version

2026-03-02 00:17:33 +08:00

6.0 KiB

Raw Blame History

成长星球项目部署步骤

项目概述

成长星球是一个儿童成长规划Web应用，使用Vue 3 + TypeScript + Vite + Pinia + Three.js + Element Plus技术栈开发。

部署前准备

1. 环境要求

Node.js 16.x 或更高版本
npm 7.x 或更高版本
服务器环境（推荐使用Nginx + PM2）
域名（可选）

2. 项目构建

克隆项目

git clone <项目仓库地址>
cd 儿童成长规划项目

安装依赖
```
npm install
```
构建生产版本
```
npm run build
```
构建完成后，生成的静态文件将位于 dist 目录中。

服务器部署

1. 服务器准备

安装Node.js

# Ubuntu/Debian
curl -fsSL https://deb.nodesource.com/setup_18.x | sudo -E bash -
sudo apt-get install -y nodejs

# CentOS/RHEL
curl -fsSL https://rpm.nodesource.com/setup_18.x | sudo bash -
sudo yum install -y nodejs

安装Nginx

# Ubuntu/Debian
sudo apt-get update
sudo apt-get install -y nginx

# CentOS/RHEL
sudo yum install -y nginx

安装PM2（可选，用于管理Node.js应用）
```
npm install -g pm2
```

2. 部署静态文件

复制构建文件到服务器

# 使用scp命令
scp -r dist/* user@server_ip:/var/www/chengzhangxingqiu

配置Nginx

创建Nginx配置文件：

sudo nano /etc/nginx/sites-available/chengzhangxingqiu

配置内容：

server {
    listen 80;
    server_name your-domain.com;

    root /var/www/chengzhangxingqiu;
    index index.html;

    location / {
        try_files $uri $uri/ /index.html;
    }

    # 静态文件缓存
    location ~* \.(js|css|png|jpg|jpeg|gif|ico)$ {
        expires 30d;
        add_header Cache-Control "public, max-age=2592000";
    }
}

启用站点

sudo ln -s /etc/nginx/sites-available/chengzhangxingqiu /etc/nginx/sites-enabled/
sudo nginx -t
sudo systemctl restart nginx

3. HTTPS配置（可选）

使用Let's Encrypt获取免费SSL证书：

# 安装certbot
sudo apt-get install certbot python3-certbot-nginx

# 获取证书
sudo certbot --nginx -d your-domain.com

# 自动更新证书
sudo systemctl enable certbot.timer

部署后检查

访问应用 打开浏览器访问 http://your-domain.com 或 https://your-domain.com
功能测试
- 测试用户登录功能
- 测试各个模块的功能
- 测试图片加载是否正常
- 测试英语发音功能
性能监控
- 监控服务器资源使用情况
- 检查页面加载速度
- 测试响应时间

维护与更新

1. 代码更新

# 拉取最新代码
git pull

# 安装新依赖
npm install

# 重新构建
npm run build

# 复制新文件到服务器
scp -r dist/* user@server_ip:/var/www/chengzhangxingqiu

# 重启Nginx（如果需要）
sudo systemctl restart nginx

2. 日志查看

# Nginx访问日志
sudo tail -f /var/log/nginx/access.log

# Nginx错误日志
sudo tail -f /var/log/nginx/error.log

3. 常见问题排查

页面空白：检查Nginx配置和文件路径
图片不显示：检查图片路径和文件权限
功能异常：检查浏览器控制台错误信息
服务器错误：检查Nginx错误日志

安全建议

定期更新依赖
```
npm update
```

设置文件权限

sudo chown -R www-data:www-data /var/www/chengzhangxingqiu
sudo chmod -R 755 /var/www/chengzhangxingqiu

启用防火墙

sudo ufw enable
sudo ufw allow 80/tcp
sudo ufw allow 443/tcp

定期备份

# 备份静态文件
tar -czf chengzhangxingqiu-backup-$(date +%Y%m%d).tar.gz /var/www/chengzhangxingqiu

部署流程图

┌─────────────────┐     ┌─────────────────┐     ┌─────────────────┐
│  本地开发环境   │────>│   构建生产版本   │────>│   部署到服务器   │
└─────────────────┘     └─────────────────┘     └─────────────────┘
                              │                         │
                              ▼                         ▼
                     ┌─────────────────┐     ┌─────────────────┐
                     │  静态文件生成   │────>│   Nginx配置     │
                     └─────────────────┘     └─────────────────┘
                                                      │
                                                      ▼
                                             ┌─────────────────┐
                                             │   HTTPS配置     │
                                             └─────────────────┘
                                                      │
                                                      ▼
                                             ┌─────────────────┐
                                             │   功能测试      │
                                             └─────────────────┘

注意事项

确保服务器有足够的磁盘空间和内存
定期更新服务器系统和软件包
监控服务器状态，及时处理异常
备份重要数据，防止数据丢失
遵循安全最佳实践，保护用户数据

部署完成后，您的成长星球应用将可以在互联网上访问，为孩子们提供一个有趣、安全的学习环境。

6.0 KiB Raw Blame History Unescape Escape