322 lines
9.0 KiB
Bash
322 lines
9.0 KiB
Bash
#!/bin/bash
|
|
set -e
|
|
|
|
# Colors for output
|
|
RED='\033[0;31m'
|
|
GREEN='\033[0;32m'
|
|
YELLOW='\033[1;33m'
|
|
BLUE='\033[0;34m'
|
|
PURPLE='\033[0;35m'
|
|
CYAN='\033[0;36m'
|
|
NC='\033[0m' # No Color
|
|
|
|
# Configuration
|
|
CLIENT_DIR="client"
|
|
DIST_DIR="dist"
|
|
PORT=${PORT:-8080}
|
|
HOST=${HOST:-localhost}
|
|
|
|
# Print colored output
|
|
print_color() {
|
|
local color=$1
|
|
local message=$2
|
|
echo -e "${color}${message}${NC}"
|
|
}
|
|
|
|
print_header() {
|
|
echo
|
|
print_color $CYAN "🚀 SeReact Frontend Client Manager"
|
|
echo
|
|
}
|
|
|
|
print_usage() {
|
|
print_header
|
|
echo "Usage: $0 [COMMAND]"
|
|
echo
|
|
echo "Commands:"
|
|
echo " dev, serve Start development server"
|
|
echo " build Build production files"
|
|
echo " deploy Deploy to static hosting"
|
|
echo " clean Clean build artifacts"
|
|
echo " install Install dependencies"
|
|
echo " lint Check code quality"
|
|
echo " test Run tests (if available)"
|
|
echo " help Show this help message"
|
|
echo
|
|
echo "Environment Variables:"
|
|
echo " PORT Development server port (default: 8080)"
|
|
echo " HOST Development server host (default: localhost)"
|
|
echo " DEPLOY_TARGET Deployment target (netlify, vercel, s3, github)"
|
|
echo
|
|
}
|
|
|
|
# Check if we're in the right directory
|
|
check_directory() {
|
|
if [ ! -d "$CLIENT_DIR" ]; then
|
|
print_color $RED "❌ Error: Client directory not found!"
|
|
print_color $YELLOW " Make sure you're running this from the project root."
|
|
exit 1
|
|
fi
|
|
}
|
|
|
|
# Start development server
|
|
start_dev_server() {
|
|
print_color $GREEN "🔧 Starting development server..."
|
|
|
|
cd "$CLIENT_DIR"
|
|
|
|
# Check if index.html exists
|
|
if [ ! -f "index.html" ]; then
|
|
print_color $RED "❌ Error: index.html not found in client directory"
|
|
exit 1
|
|
fi
|
|
|
|
# Check if Python is available
|
|
if command -v python3 &> /dev/null; then
|
|
print_color $BLUE "🐍 Using Python development server"
|
|
python3 serve.py
|
|
elif command -v python &> /dev/null; then
|
|
print_color $BLUE "🐍 Using Python development server"
|
|
python serve.py
|
|
else
|
|
print_color $YELLOW "⚠️ Python not found, using basic HTTP server"
|
|
# Fallback to basic HTTP server
|
|
if command -v npx &> /dev/null; then
|
|
npx http-server . -p $PORT --cors
|
|
else
|
|
print_color $RED "❌ No suitable HTTP server found"
|
|
print_color $YELLOW " Please install Python or Node.js"
|
|
exit 1
|
|
fi
|
|
fi
|
|
}
|
|
|
|
# Build production files
|
|
build_production() {
|
|
print_color $GREEN "🏗️ Building production files..."
|
|
|
|
# Create dist directory
|
|
mkdir -p "$DIST_DIR"
|
|
|
|
# Copy client files to dist
|
|
print_color $BLUE "📁 Copying files to $DIST_DIR..."
|
|
cp -r "$CLIENT_DIR"/* "$DIST_DIR/"
|
|
|
|
# Remove development-only files
|
|
if [ -f "$DIST_DIR/serve.py" ]; then
|
|
rm "$DIST_DIR/serve.py"
|
|
print_color $YELLOW "🗑️ Removed serve.py (development only)"
|
|
fi
|
|
|
|
if [ -d "$DIST_DIR/venv" ]; then
|
|
rm -rf "$DIST_DIR/venv"
|
|
print_color $YELLOW "🗑️ Removed venv directory (development only)"
|
|
fi
|
|
|
|
if [ -f "$DIST_DIR/requirements.txt" ]; then
|
|
rm "$DIST_DIR/requirements.txt"
|
|
print_color $YELLOW "🗑️ Removed requirements.txt (development only)"
|
|
fi
|
|
|
|
# Minify files if tools are available
|
|
if command -v terser &> /dev/null; then
|
|
print_color $BLUE "🗜️ Minifying JavaScript files..."
|
|
find "$DIST_DIR/js" -name "*.js" -exec terser {} -o {} \;
|
|
fi
|
|
|
|
if command -v csso &> /dev/null; then
|
|
print_color $BLUE "🗜️ Minifying CSS files..."
|
|
find "$DIST_DIR" -name "*.css" -exec csso {} --output {} \;
|
|
fi
|
|
|
|
print_color $GREEN "✅ Build completed successfully!"
|
|
print_color $CYAN "📦 Production files are in: $DIST_DIR/"
|
|
}
|
|
|
|
# Deploy to static hosting
|
|
deploy_production() {
|
|
local target=${DEPLOY_TARGET:-"manual"}
|
|
|
|
print_color $GREEN "🚀 Deploying to $target..."
|
|
|
|
# Build first
|
|
build_production
|
|
|
|
case $target in
|
|
"netlify")
|
|
if command -v netlify &> /dev/null; then
|
|
cd "$DIST_DIR"
|
|
netlify deploy --prod --dir .
|
|
else
|
|
print_color $RED "❌ Netlify CLI not found"
|
|
print_color $YELLOW " Install with: npm install -g netlify-cli"
|
|
fi
|
|
;;
|
|
"vercel")
|
|
if command -v vercel &> /dev/null; then
|
|
cd "$DIST_DIR"
|
|
vercel --prod
|
|
else
|
|
print_color $RED "❌ Vercel CLI not found"
|
|
print_color $YELLOW " Install with: npm install -g vercel"
|
|
fi
|
|
;;
|
|
"s3")
|
|
if command -v aws &> /dev/null; then
|
|
if [ -z "$S3_BUCKET" ]; then
|
|
print_color $RED "❌ S3_BUCKET environment variable not set"
|
|
exit 1
|
|
fi
|
|
aws s3 sync "$DIST_DIR/" "s3://$S3_BUCKET/" --delete
|
|
print_color $GREEN "✅ Deployed to S3 bucket: $S3_BUCKET"
|
|
else
|
|
print_color $RED "❌ AWS CLI not found"
|
|
print_color $YELLOW " Install AWS CLI first"
|
|
fi
|
|
;;
|
|
"github")
|
|
print_color $BLUE "📋 GitHub Pages deployment instructions:"
|
|
echo "1. Push the contents of $DIST_DIR/ to your gh-pages branch"
|
|
echo "2. Enable GitHub Pages in repository settings"
|
|
echo "3. Set source to gh-pages branch"
|
|
;;
|
|
*)
|
|
print_color $BLUE "📋 Manual deployment instructions:"
|
|
echo "1. Upload the contents of $DIST_DIR/ to your web server"
|
|
echo "2. Configure your server to serve index.html for all routes"
|
|
echo "3. Ensure CORS is configured for API calls"
|
|
;;
|
|
esac
|
|
}
|
|
|
|
# Clean build artifacts
|
|
clean_build() {
|
|
print_color $YELLOW "🧹 Cleaning build artifacts..."
|
|
|
|
if [ -d "$DIST_DIR" ]; then
|
|
rm -rf "$DIST_DIR"
|
|
print_color $GREEN "✅ Removed $DIST_DIR directory"
|
|
fi
|
|
|
|
# Clean any cache directories
|
|
if [ -d "$CLIENT_DIR/__pycache__" ]; then
|
|
rm -rf "$CLIENT_DIR/__pycache__"
|
|
print_color $GREEN "✅ Removed Python cache"
|
|
fi
|
|
|
|
print_color $GREEN "✅ Clean completed!"
|
|
}
|
|
|
|
# Install dependencies
|
|
install_dependencies() {
|
|
print_color $GREEN "📦 Installing dependencies..."
|
|
|
|
cd "$CLIENT_DIR"
|
|
|
|
# Check if virtual environment exists
|
|
if [ ! -d "venv" ]; then
|
|
print_color $BLUE "🐍 Creating Python virtual environment..."
|
|
python3 -m venv venv
|
|
fi
|
|
|
|
# Activate virtual environment
|
|
if [ -f "venv/Scripts/activate" ]; then
|
|
# Windows with Git Bash
|
|
source venv/Scripts/activate
|
|
else
|
|
# Linux/macOS
|
|
source venv/bin/activate
|
|
fi
|
|
|
|
# Install Python dependencies
|
|
if [ -f "requirements.txt" ]; then
|
|
print_color $BLUE "📋 Installing Python packages..."
|
|
pip install -r requirements.txt
|
|
fi
|
|
|
|
print_color $GREEN "✅ Dependencies installed!"
|
|
}
|
|
|
|
# Lint code
|
|
lint_code() {
|
|
print_color $GREEN "🔍 Checking code quality..."
|
|
|
|
cd "$CLIENT_DIR"
|
|
|
|
# Check HTML
|
|
if command -v tidy &> /dev/null; then
|
|
print_color $BLUE "🔍 Checking HTML..."
|
|
tidy -q -e index.html || true
|
|
fi
|
|
|
|
# Check JavaScript
|
|
if command -v eslint &> /dev/null; then
|
|
print_color $BLUE "🔍 Checking JavaScript..."
|
|
eslint js/*.js || true
|
|
fi
|
|
|
|
# Check CSS
|
|
if command -v stylelint &> /dev/null; then
|
|
print_color $BLUE "🔍 Checking CSS..."
|
|
stylelint *.css || true
|
|
fi
|
|
|
|
print_color $GREEN "✅ Code quality check completed!"
|
|
}
|
|
|
|
# Run tests
|
|
run_tests() {
|
|
print_color $GREEN "🧪 Running tests..."
|
|
|
|
cd "$CLIENT_DIR"
|
|
|
|
# Check if test files exist
|
|
if [ -d "tests" ] || [ -f "test.html" ]; then
|
|
print_color $BLUE "🧪 Running frontend tests..."
|
|
# Add test runner here when tests are implemented
|
|
print_color $YELLOW "⚠️ No test runner configured yet"
|
|
else
|
|
print_color $YELLOW "⚠️ No tests found"
|
|
fi
|
|
|
|
print_color $GREEN "✅ Tests completed!"
|
|
}
|
|
|
|
# Main script logic
|
|
main() {
|
|
case "${1:-help}" in
|
|
"dev"|"serve")
|
|
check_directory
|
|
start_dev_server
|
|
;;
|
|
"build")
|
|
check_directory
|
|
build_production
|
|
;;
|
|
"deploy")
|
|
check_directory
|
|
deploy_production
|
|
;;
|
|
"clean")
|
|
clean_build
|
|
;;
|
|
"install")
|
|
check_directory
|
|
install_dependencies
|
|
;;
|
|
"lint")
|
|
check_directory
|
|
lint_code
|
|
;;
|
|
"test")
|
|
check_directory
|
|
run_tests
|
|
;;
|
|
"help"|*)
|
|
print_usage
|
|
;;
|
|
esac
|
|
}
|
|
|
|
# Run main function with all arguments
|
|
main "$@" |