snapshot/frontend/deploy.sh

#!/bin/bash

##############################################
# Snapshot 前端部署脚本
# 适用于 Linux 环境
##############################################

# 颜色输出
RED='\033[0;31m'
GREEN='\033[0;32m'
YELLOW='\033[1;33m'
BLUE='\033[0;34m'
NC='\033[0m' # No Color

# 打印带颜色的消息
print_info() {
    echo -e "${GREEN}[INFO]${NC} $1"
}

print_error() {
    echo -e "${RED}[ERROR]${NC} $1"
}

print_warning() {
    echo -e "${YELLOW}[WARNING]${NC} $1"
}

# 检查命令是否存在
command_exists() {
    command -v "$1" >/dev/null 2>&1
}

echo "============================================"
echo "Snapshot 前端部署脚本"
echo "============================================"
echo

# 1. 检查Node.js环境
echo "[1/5] 检查Node.js环境..."
if ! command_exists node; then
    print_error "未检测到Node.js环境"
    echo "请安装 Node.js 16 或更高版本"
    exit 1
fi

NODE_VERSION=$(node -v)
NPM_VERSION=$(npm -v)
print_info "Node.js环境检查通过"
echo "Node版本: $NODE_VERSION"
echo "NPM版本: $NPM_VERSION"
echo

# 2. 检查npm环境
echo "[2/5] 检查npm环境..."
if ! command_exists npm; then
    print_error "未检测到npm环境"
    exit 1
fi
print_info "npm环境检查通过"
echo

# 3. 安装项目依赖
echo "[3/5] 安装项目依赖..."
if [ ! -d "node_modules" ]; then
    print_info "正在安装依赖，请稍候..."
    npm install
    if [ $? -neq 0 ]; then
        print_error "依赖安装失败"
        exit 1
    fi
    print_info "依赖安装完成"
else
    print_info "依赖已存在，跳过安装"
fi
echo

# 4. 构建项目
echo "[4/5] 构建项目..."
npm run build
if [ $? -neq 0 ]; then
    print_error "项目构建失败"
    exit 1
fi
print_info "项目构建完成"
echo

# 5. 启动服务
echo "[5/5] 启动服务..."
echo
echo "============================================"
echo "选择启动模式："
echo "============================================"
echo "1. 开发模式（热重载，端口8081）"
echo "2. 生产模式（使用nginx等服务器）"
echo "3. 仅构建（不启动服务器）"
echo
read -p "请输入选项 (1/2/3): " mode

case $mode in
    1)
        echo
        print_info "启动开发服务器..."
        echo "访问地址: http://localhost:8081"
        echo
        echo "按 Ctrl+C 停止服务器"
        echo
        npm run serve
        ;;
    2)
        echo
        print_info "启动生产服务器..."

        # 检查dist目录
        if [ ! -d "dist" ]; then
            print_error "dist目录不存在，请先执行构建"
            exit 1
        fi

        # 使用Python的简单HTTP服务器（如果可用）
        if command_exists python3; then
            echo "使用Python HTTP服务器"
            echo "访问地址: http://localhost:8081"
            cd dist && python3 -m http.server 8081
        # 使用npx http-server
        elif command_exists npx; then
            echo "使用http-server"
            echo "访问地址: http://localhost:8081"
            npx http-server dist -p 8081
        else
            print_warning "未找到HTTP服务器工具"
            echo "请安装nginx或使用以下命令："
            echo "  npm install -g http-server"
            echo "  http-server dist -p 8081"
            echo
            print_info "构建文件位于: dist目录"
            print_info "您可以将dist目录部署到任何静态文件服务器"
            exit 0
        fi
        ;;
    3)
        echo
        print_info "构建完成！"
        echo "构建文件位于: dist目录"
        echo
        echo "部署到生产环境："
        echo "1. 将dist目录复制到Web服务器"
        echo "2. 配置nginx指向dist目录"
        echo "3. 或使用任何静态文件托管服务"
        echo
        echo "nginx配置示例："
        echo "server {"
        echo "    listen 80;"
        echo "    server_name localhost;"
        echo "    root /path/to/dist;"
        echo "    index index.html;"
        echo "    location / {"
        echo "        try_files \$uri \$uri/ /index.html;"
        echo "    }"
        echo "}"
        ;;
    *)
        print_error "无效的选项"
        exit 1
        ;;
esac