docs: reorganize documentation structure with 7-item folder limits
- Create logical sub-folder classification for all documentation - Organize 91 migration files into component-specific folders - Separate user guides, build system, migration, and development docs - Maintain maximum 7 items per folder for easy navigation - Add comprehensive README and reorganization summary - Ensure all changes tracked in git with proper versioning Structure: - user-guides/ (3 items): user-facing documentation - build-system/ (3 items): core, platforms, automation - migration/ (6 items): assessments, testing, templates - development/ (4 items): tools and standards - architecture/, testing/, examples/ (ready for future docs) Total: 24 folders created, all within 7-item limits
This commit is contained in:
Matthew Raymer
422
docs/build-system/platforms/android-build-scripts.md
Normal file
422
docs/build-system/platforms/android-build-scripts.md
Normal file
@@ -0,0 +1,422 @@
|
||||
# Android Build Scripts Documentation
|
||||
|
||||
**Author**: Matthew Raymer
|
||||
**Date**: 2025-07-11
|
||||
**Status**: ✅ **COMPLETE** - Full Android build system integration
|
||||
|
||||
## Overview
|
||||
|
||||
The Android build system for TimeSafari has been integrated with the Vite
|
||||
mode-based pattern, providing consistent environment management and flexible
|
||||
build options across development, testing, and production environments.
|
||||
|
||||
**Note:** All Android builds should be invoked via `npm run build:android*` scripts for consistency. The legacy `build:capacitor:android*` scripts are now aliases for the corresponding `build:android*` scripts.
|
||||
|
||||
## Build Script Integration
|
||||
|
||||
### Package.json Scripts
|
||||
|
||||
The Android build system is fully integrated into `package.json` with the
|
||||
following scripts:
|
||||
|
||||
#### Basic Build Commands
|
||||
|
||||
```bash
|
||||
# Development builds (defaults to --mode development)
|
||||
npm run build:android:dev # Development build
|
||||
npm run build:android:test # Testing build
|
||||
npm run build:android:prod # Production build
|
||||
```
|
||||
|
||||
#### Build Type Commands
|
||||
|
||||
```bash
|
||||
# Debug builds
|
||||
npm run build:android:debug # Debug APK build
|
||||
|
||||
# Release builds
|
||||
npm run build:android:release # Release APK build
|
||||
```
|
||||
|
||||
#### Specialized Commands
|
||||
|
||||
```bash
|
||||
# Android Studio integration
|
||||
npm run build:android:studio # Build + open Android Studio
|
||||
|
||||
# Package builds
|
||||
npm run build:android:apk # Build APK file
|
||||
npm run build:android:aab # Build AAB (Android App Bundle)
|
||||
|
||||
# Utility commands
|
||||
npm run build:android:clean # Clean build artifacts only
|
||||
npm run build:android:sync # Sync Capacitor only
|
||||
npm run build:android:assets # Generate assets only
|
||||
```
|
||||
|
||||
#### Legacy Command
|
||||
|
||||
```bash
|
||||
# Original script (maintains backward compatibility)
|
||||
npm run build:android # Full build process
|
||||
```
|
||||
|
||||
## Script Usage
|
||||
|
||||
### Direct Script Usage
|
||||
|
||||
The `build-android.sh` script supports comprehensive command-line options:
|
||||
|
||||
```bash
|
||||
# Basic usage
|
||||
./scripts/build-android.sh [options]
|
||||
|
||||
# Environment-specific builds
|
||||
./scripts/build-android.sh --dev --studio # Development + open studio
|
||||
./scripts/build-android.sh --test --apk # Testing APK build
|
||||
./scripts/build-android.sh --prod --aab # Production AAB build
|
||||
|
||||
# Utility operations
|
||||
./scripts/build-android.sh --clean # Clean only
|
||||
./scripts/build-android.sh --sync # Sync only
|
||||
./scripts/build-android.sh --assets # Assets only
|
||||
```
|
||||
|
||||
### Command-Line Options
|
||||
|
||||
| Option | Description | Default |
|
||||
|--------|-------------|---------|
|
||||
| `--dev`, `--development` | Build for development environment | ✅ |
|
||||
| `--test` | Build for testing environment | |
|
||||
| `--prod`, `--production` | Build for production environment | |
|
||||
| `--debug` | Build debug APK | ✅ |
|
||||
| `--release` | Build release APK | |
|
||||
| `--studio` | Open Android Studio after build | |
|
||||
| `--apk` | Build APK file | |
|
||||
| `--aab` | Build AAB (Android App Bundle) | |
|
||||
| `--clean` | Clean build artifacts only | |
|
||||
| `--sync` | Sync Capacitor only | |
|
||||
| `--assets` | Generate assets only | |
|
||||
| `-h`, `--help` | Show help message | |
|
||||
| `-v`, `--verbose` | Enable verbose logging | |
|
||||
|
||||
## Build Process
|
||||
|
||||
### Complete Build Flow
|
||||
|
||||
1. **Resource Check**: Validate Android resources
|
||||
2. **Cleanup**: Clean Android app and build artifacts
|
||||
3. **Capacitor Build**: Build web assets with environment-specific mode
|
||||
4. **Gradle Clean**: Clean Gradle build cache
|
||||
5. **Gradle Build**: Assemble debug/release APK
|
||||
6. **Capacitor Sync**: Sync web assets to Android platform
|
||||
7. **Asset Generation**: Generate Android-specific assets
|
||||
8. **Package Build**: Build APK/AAB if requested
|
||||
9. **Studio Launch**: Open Android Studio if requested
|
||||
|
||||
### Environment-Specific Builds
|
||||
|
||||
#### Development Environment (`--dev`)
|
||||
|
||||
```bash
|
||||
# Uses --mode development
|
||||
npm run build:capacitor
|
||||
# Builds with development optimizations and debugging enabled
|
||||
```
|
||||
|
||||
#### Testing Environment (`--test`)
|
||||
|
||||
```bash
|
||||
# Uses --mode test
|
||||
npm run build:capacitor -- --mode test
|
||||
# Builds with testing configurations and test API endpoints
|
||||
```
|
||||
|
||||
#### Production Environment (`--prod`)
|
||||
|
||||
```bash
|
||||
# Uses --mode production
|
||||
npm run build:capacitor -- --mode production
|
||||
# Builds with production optimizations and live API endpoints
|
||||
```
|
||||
|
||||
## Build Artifacts
|
||||
|
||||
### APK Files
|
||||
|
||||
- **Debug APK**: `android/app/build/outputs/apk/debug/app-debug.apk`
|
||||
- **Release APK**: `android/app/build/outputs/apk/release/app-release.apk`
|
||||
|
||||
### AAB Files
|
||||
|
||||
- **Release AAB**: `android/app/build/outputs/bundle/release/app-release.aab`
|
||||
|
||||
### Build Locations
|
||||
|
||||
```bash
|
||||
# APK files
|
||||
android/app/build/outputs/apk/debug/
|
||||
android/app/build/outputs/apk/release/
|
||||
|
||||
# AAB files
|
||||
android/app/build/outputs/bundle/release/
|
||||
|
||||
# Gradle build cache
|
||||
android/app/build/
|
||||
android/.gradle/
|
||||
```
|
||||
|
||||
## Environment Variables
|
||||
|
||||
The build system automatically sets environment variables based on the build
|
||||
type:
|
||||
|
||||
### Capacitor Environment
|
||||
|
||||
```bash
|
||||
VITE_PLATFORM=capacitor
|
||||
VITE_PWA_ENABLED=false
|
||||
VITE_DISABLE_PWA=true
|
||||
DEBUG_MIGRATIONS=0
|
||||
```
|
||||
|
||||
### Git Integration
|
||||
|
||||
```bash
|
||||
VITE_GIT_HASH=<git-commit-hash>
|
||||
# Automatically set from current git commit
|
||||
```
|
||||
|
||||
## Error Handling
|
||||
|
||||
### Exit Codes
|
||||
|
||||
| Code | Description |
|
||||
|------|-------------|
|
||||
| 1 | Android cleanup failed |
|
||||
| 2 | Web build failed |
|
||||
| 3 | Capacitor build failed |
|
||||
| 4 | Gradle clean failed |
|
||||
| 5 | Gradle assemble failed |
|
||||
| 6 | Capacitor sync failed |
|
||||
| 7 | Asset generation failed |
|
||||
| 8 | Android Studio launch failed |
|
||||
| 9 | Resource check failed |
|
||||
|
||||
### Common Issues
|
||||
|
||||
#### Resource Check Failures
|
||||
|
||||
```bash
|
||||
# Resource check may find issues but continues build
|
||||
log_warning "Resource check found issues, but continuing with build..."
|
||||
```
|
||||
|
||||
#### Gradle Build Failures
|
||||
|
||||
```bash
|
||||
# Check Android SDK and build tools
|
||||
./android/gradlew --version
|
||||
# Verify JAVA_HOME is set correctly
|
||||
echo $JAVA_HOME
|
||||
```
|
||||
|
||||
## Integration with Capacitor
|
||||
|
||||
### Capacitor Sync Process
|
||||
|
||||
```bash
|
||||
# Full sync (all platforms)
|
||||
npx cap sync
|
||||
|
||||
# Android-specific sync
|
||||
npx cap sync android
|
||||
```
|
||||
|
||||
### Asset Generation
|
||||
|
||||
```bash
|
||||
# Generate Android-specific assets
|
||||
npx capacitor-assets generate --android
|
||||
```
|
||||
|
||||
### Android Studio Integration
|
||||
|
||||
```bash
|
||||
# Open Android Studio with project
|
||||
npx cap open android
|
||||
```
|
||||
|
||||
## Development Workflow
|
||||
|
||||
### Typical Development Cycle
|
||||
|
||||
```bash
|
||||
# 1. Make code changes
|
||||
# 2. Build for development
|
||||
npm run build:android:dev
|
||||
|
||||
# 3. Open Android Studio for debugging
|
||||
npm run build:android:studio
|
||||
|
||||
# 4. Test on device/emulator
|
||||
# 5. Iterate and repeat
|
||||
```
|
||||
|
||||
### Testing Workflow
|
||||
|
||||
```bash
|
||||
# 1. Build for testing environment
|
||||
npm run build:android:test
|
||||
|
||||
# 2. Build test APK
|
||||
npm run build:android:test -- --apk
|
||||
|
||||
# 3. Install and test on device
|
||||
adb install android/app/build/outputs/apk/debug/app-debug.apk
|
||||
```
|
||||
|
||||
### Production Workflow
|
||||
|
||||
```bash
|
||||
# 1. Build for production environment
|
||||
npm run build:android:prod
|
||||
|
||||
# 2. Build release AAB for Play Store
|
||||
npm run build:android:prod -- --aab
|
||||
|
||||
# 3. Sign and upload to Play Console
|
||||
```
|
||||
|
||||
## Performance Optimization
|
||||
|
||||
### Build Time Optimization
|
||||
|
||||
- **Incremental Builds**: Gradle caches build artifacts
|
||||
- **Parallel Execution**: Multiple build steps run in parallel
|
||||
- **Resource Optimization**: Assets are optimized for Android
|
||||
|
||||
### Memory Management
|
||||
|
||||
- **Gradle Daemon**: Reuses JVM for faster builds
|
||||
- **Build Cache**: Caches compiled resources
|
||||
- **Clean Builds**: Full cleanup when needed
|
||||
|
||||
## Troubleshooting
|
||||
|
||||
### Common Build Issues
|
||||
|
||||
#### Gradle Build Failures
|
||||
|
||||
```bash
|
||||
# Clean Gradle cache
|
||||
cd android && ./gradlew clean && cd ..
|
||||
|
||||
# Check Java version
|
||||
java -version
|
||||
|
||||
# Verify Android SDK
|
||||
echo $ANDROID_HOME
|
||||
```
|
||||
|
||||
#### Capacitor Sync Issues
|
||||
|
||||
```bash
|
||||
# Force full sync
|
||||
npx cap sync android --force
|
||||
|
||||
# Check Capacitor configuration
|
||||
cat capacitor.config.json
|
||||
```
|
||||
|
||||
#### Asset Generation Issues
|
||||
|
||||
```bash
|
||||
# Regenerate assets
|
||||
npx capacitor-assets generate --android --force
|
||||
|
||||
# Check asset source files
|
||||
ls -la src/assets/
|
||||
```
|
||||
|
||||
### Debug Mode
|
||||
|
||||
```bash
|
||||
# Enable verbose logging
|
||||
./scripts/build-android.sh --verbose
|
||||
|
||||
# Show environment variables
|
||||
./scripts/build-android.sh --env
|
||||
```
|
||||
|
||||
## Best Practices
|
||||
|
||||
### Build Optimization
|
||||
|
||||
1. **Use Appropriate Environment**: Always specify the correct environment
|
||||
2. **Clean When Needed**: Use `--clean` for troubleshooting
|
||||
3. **Incremental Builds**: Avoid unnecessary full rebuilds
|
||||
4. **Asset Management**: Keep assets optimized for mobile
|
||||
|
||||
### Development Workflow
|
||||
|
||||
1. **Development Builds**: Use `--dev` for daily development
|
||||
2. **Testing Builds**: Use `--test` for QA testing
|
||||
3. **Production Builds**: Use `--prod` for release builds
|
||||
4. **Studio Integration**: Use `--studio` for debugging
|
||||
|
||||
### Error Prevention
|
||||
|
||||
1. **Resource Validation**: Always run resource checks
|
||||
2. **Environment Consistency**: Use consistent environment variables
|
||||
3. **Build Verification**: Test builds on actual devices
|
||||
4. **Version Control**: Keep build scripts in version control
|
||||
|
||||
## Migration from Legacy System
|
||||
|
||||
### Backward Compatibility
|
||||
|
||||
The new system maintains full backward compatibility:
|
||||
|
||||
```bash
|
||||
# Old command still works (now an alias)
|
||||
npm run build:capacitor:android
|
||||
|
||||
# New commands provide more flexibility
|
||||
npm run build:android:dev
|
||||
npm run build:android:test
|
||||
npm run build:android:prod
|
||||
```
|
||||
|
||||
**Note:** All Android builds should use the `build:android*` pattern. The `build:capacitor:android*` scripts are provided as aliases for compatibility but will be deprecated in the future.
|
||||
|
||||
### Migration Checklist
|
||||
|
||||
- [ ] Update CI/CD pipelines to use new commands
|
||||
- [ ] Update documentation references
|
||||
- [ ] Train team on new build options
|
||||
- [ ] Test all build environments
|
||||
- [ ] Verify artifact locations
|
||||
|
||||
## Future Enhancements
|
||||
|
||||
### Planned Features
|
||||
|
||||
1. **Build Profiles**: Custom build configurations
|
||||
2. **Automated Testing**: Integration with test suites
|
||||
3. **Build Analytics**: Performance metrics and reporting
|
||||
4. **Cloud Builds**: Remote build capabilities
|
||||
|
||||
### Integration Opportunities
|
||||
|
||||
1. **Fastlane Integration**: Automated deployment
|
||||
2. **CI/CD Enhancement**: Pipeline optimization
|
||||
3. **Monitoring**: Build performance tracking
|
||||
4. **Documentation**: Auto-generated build reports
|
||||
|
||||
---
|
||||
|
||||
**Status**: Complete and ready for production use
|
||||
**Last Updated**: 2025-07-11
|
||||
**Version**: 1.0
|
||||
**Maintainer**: Matthew Raymer
|
||||
146
docs/build-system/platforms/database-clearing.md
Normal file
146
docs/build-system/platforms/database-clearing.md
Normal file
@@ -0,0 +1,146 @@
|
||||
# Database Clearing for Development
|
||||
|
||||
**Author**: Matthew Raymer
|
||||
**Date**: 2025-07-11
|
||||
**Status**: **ACTIVE** - Production Ready
|
||||
|
||||
## Overview
|
||||
|
||||
TimeSafari provides a simple script-based approach to clear the database for development purposes. This avoids the complexity of programmatic database clearing and provides reliable, platform-specific solutions.
|
||||
|
||||
## Quick Start
|
||||
|
||||
```bash
|
||||
# Run the interactive database clearing script
|
||||
./scripts/clear-database.sh
|
||||
|
||||
# Then restart your development server
|
||||
npm run build:electron:dev # For Electron
|
||||
npm run build:web:dev # For Web
|
||||
```
|
||||
|
||||
## Platform-Specific Approaches
|
||||
|
||||
### Electron (Desktop App)
|
||||
|
||||
The script automatically detects your platform and clears the SQLite database files:
|
||||
|
||||
- **Linux**: `~/.config/TimeSafari/`
|
||||
- **macOS**: `~/Library/Application Support/TimeSafari/`
|
||||
- **Windows**: `%APPDATA%\TimeSafari`
|
||||
|
||||
### Web Browser
|
||||
|
||||
For web browsers, the script provides two approaches:
|
||||
|
||||
#### 1. Custom Data Directory (Recommended)
|
||||
|
||||
Create an isolated browser profile for development:
|
||||
|
||||
```bash
|
||||
# Create isolated profile
|
||||
mkdir ~/timesafari-dev-data
|
||||
|
||||
# Start browser with custom profile
|
||||
google-chrome --user-data-dir=~/timesafari-dev-data
|
||||
|
||||
# Clear when needed
|
||||
rm -rf ~/timesafari-dev-data
|
||||
```
|
||||
|
||||
#### 2. Manual Browser Clearing
|
||||
|
||||
Use browser DevTools to clear IndexedDB:
|
||||
|
||||
1. Open Developer Tools (F12)
|
||||
2. Go to Application/Storage tab
|
||||
3. Find 'IndexedDB' section
|
||||
4. Delete 'TimeSafari' database
|
||||
5. Refresh the page
|
||||
|
||||
## Why Script-Based Approach?
|
||||
|
||||
### **Simplicity**
|
||||
- No complex programmatic database clearing
|
||||
- No browser storage complications
|
||||
- No race conditions or permission issues
|
||||
|
||||
### **Reliability**
|
||||
- Direct file system access for Electron
|
||||
- Isolated browser profiles for web
|
||||
- Clear, predictable behavior
|
||||
|
||||
### **Safety**
|
||||
- Interactive script guides users
|
||||
- Platform-specific instructions
|
||||
- Only clears TimeSafari data
|
||||
|
||||
## Manual Commands
|
||||
|
||||
If you prefer manual commands:
|
||||
|
||||
### Electron
|
||||
```bash
|
||||
# Linux
|
||||
rm -rf ~/.config/TimeSafari/*
|
||||
|
||||
# macOS
|
||||
rm -rf ~/Library/Application\ Support/TimeSafari/*
|
||||
|
||||
# Windows
|
||||
rmdir /s /q %APPDATA%\TimeSafari
|
||||
```
|
||||
|
||||
### Web Browser
|
||||
```bash
|
||||
# Create and use isolated profile
|
||||
mkdir ~/timesafari-dev-data
|
||||
google-chrome --user-data-dir=~/timesafari-dev-data
|
||||
|
||||
# Clear when needed
|
||||
rm -rf ~/timesafari-dev-data
|
||||
```
|
||||
|
||||
## Best Practices
|
||||
|
||||
1. **Stop the development server** before clearing
|
||||
2. **Use isolated browser profiles** for web development
|
||||
3. **Restart the development server** after clearing
|
||||
4. **Backup important data** before clearing
|
||||
5. **Use the script** for consistent behavior
|
||||
|
||||
## Troubleshooting
|
||||
|
||||
### Script Not Found
|
||||
```bash
|
||||
# Make sure script is executable
|
||||
chmod +x scripts/clear-database.sh
|
||||
|
||||
# Run from project root
|
||||
./scripts/clear-database.sh
|
||||
```
|
||||
|
||||
### Permission Errors
|
||||
```bash
|
||||
# Check file permissions
|
||||
ls -la ~/.config/TimeSafari/
|
||||
|
||||
# Use sudo if needed (rare)
|
||||
sudo rm -rf ~/.config/TimeSafari/*
|
||||
```
|
||||
|
||||
### Browser Profile Issues
|
||||
```bash
|
||||
# Ensure browser is completely closed
|
||||
pkill -f chrome
|
||||
pkill -f firefox
|
||||
|
||||
# Then clear profile
|
||||
rm -rf ~/timesafari-dev-data
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
**Last Updated**: 2025-07-11
|
||||
**Version**: 1.0.3-beta
|
||||
**Status**: Production Ready
|
||||
174
docs/build-system/platforms/electron-auto-updates.md
Normal file
174
docs/build-system/platforms/electron-auto-updates.md
Normal file
@@ -0,0 +1,174 @@
|
||||
# Electron Auto-Updates Configuration
|
||||
|
||||
**Author**: Matthew Raymer
|
||||
**Date**: 2025-07-12
|
||||
**Status**: **DISABLED** - Manual Updates Only
|
||||
|
||||
## Overview
|
||||
|
||||
TimeSafari's Electron application currently has auto-updates disabled due to hosting on Gitea instead of GitHub. This document explains the current configuration and provides guidance for future update mechanisms.
|
||||
|
||||
## Current Status
|
||||
|
||||
### Auto-Updates Disabled
|
||||
|
||||
Auto-updates are currently disabled for the following reasons:
|
||||
|
||||
1. **Repository Hosting**: The project is hosted on Gitea (`https://gitea.anomalistdesign.com/trent_larson/crowd-funder-for-time-pwa`) rather than GitHub
|
||||
2. **Provider Limitations**: `electron-updater` primarily supports GitHub, S3, and other major cloud providers
|
||||
3. **404 Errors**: Attempting to use GitHub auto-updates with a Gitea repository causes 404 errors
|
||||
|
||||
### Configuration Changes Made
|
||||
|
||||
1. **Repository URL Updated**: Changed from `https://github.com/trentlarson/crowd-master` to the correct Gitea URL
|
||||
2. **Publish Configuration Removed**: Removed GitHub provider from `electron-builder.config.json`
|
||||
3. **Auto-Updater Disabled**: Commented out auto-updater code in `electron/src/index.ts`
|
||||
|
||||
## Error Resolution
|
||||
|
||||
The original error:
|
||||
```
|
||||
HttpError: 404
|
||||
"method: GET url: https://github.com/trentlarson/crowd-master/releases.atom"
|
||||
```
|
||||
|
||||
This occurred because:
|
||||
- The app was trying to check for updates on GitHub
|
||||
- The repository doesn't exist on GitHub
|
||||
- The auto-updater was configured for GitHub releases
|
||||
|
||||
## Future Update Options
|
||||
|
||||
### Option 1: Manual Distribution
|
||||
- Build and distribute packages manually
|
||||
- Users download and install new versions manually
|
||||
- No automatic update checking
|
||||
|
||||
### Option 2: Custom Update Server
|
||||
- Implement a custom update server compatible with `electron-updater`
|
||||
- Host update files on a web server
|
||||
- Configure custom update endpoints
|
||||
|
||||
### Option 3: GitHub Migration
|
||||
- Move repository to GitHub
|
||||
- Set up GitHub releases
|
||||
- Re-enable auto-updates
|
||||
|
||||
### Option 4: Alternative Update Providers
|
||||
- Use S3 or other supported providers
|
||||
- Implement custom update mechanism
|
||||
- Use third-party update services
|
||||
|
||||
## Current Build Process
|
||||
|
||||
### Development Builds
|
||||
```bash
|
||||
npm run build:electron:dev
|
||||
```
|
||||
|
||||
### Production Builds
|
||||
```bash
|
||||
npm run build:electron:prod
|
||||
```
|
||||
|
||||
### Package Distribution
|
||||
```bash
|
||||
# Windows
|
||||
npm run build:electron:windows:prod
|
||||
|
||||
# macOS
|
||||
npm run build:electron:mac:prod
|
||||
|
||||
# Linux
|
||||
npm run build:electron:linux:prod
|
||||
```
|
||||
|
||||
## Manual Update Process
|
||||
|
||||
1. **Build New Version**: Use appropriate build script
|
||||
2. **Test Package**: Verify the built package works correctly
|
||||
3. **Distribute**: Share the package with users
|
||||
4. **User Installation**: Users manually download and install
|
||||
|
||||
## Security Considerations
|
||||
|
||||
### Disabled Auto-Updates
|
||||
- No automatic security updates
|
||||
- Users must manually update for security patches
|
||||
- Consider implementing update notifications
|
||||
|
||||
### Package Verification
|
||||
- Verify package integrity before distribution
|
||||
- Use code signing for packages
|
||||
- Implement checksum verification
|
||||
|
||||
## Monitoring and Maintenance
|
||||
|
||||
### Version Tracking
|
||||
- Track application versions manually
|
||||
- Document changes between versions
|
||||
- Maintain changelog for users
|
||||
|
||||
### User Communication
|
||||
- Notify users of available updates
|
||||
- Provide clear update instructions
|
||||
- Document breaking changes
|
||||
|
||||
## Recommendations
|
||||
|
||||
### Short Term
|
||||
1. Continue with manual distribution
|
||||
2. Implement update notifications in-app
|
||||
3. Provide clear update instructions
|
||||
|
||||
### Long Term
|
||||
1. Evaluate hosting platform options
|
||||
2. Consider implementing custom update server
|
||||
3. Plan for automated update mechanism
|
||||
|
||||
## Configuration Files
|
||||
|
||||
### electron-builder.config.json
|
||||
```json
|
||||
{
|
||||
"appId": "app.timesafari.desktop",
|
||||
"productName": "TimeSafari",
|
||||
// publish configuration removed
|
||||
}
|
||||
```
|
||||
|
||||
### electron/src/index.ts
|
||||
```typescript
|
||||
// Auto-updater disabled
|
||||
// import { autoUpdater } from 'electron-updater';
|
||||
|
||||
// Auto-updates disabled - not supported on Gitea hosting
|
||||
// if (!electronIsDev && !process.env.APPIMAGE) {
|
||||
// try {
|
||||
// autoUpdater.checkForUpdatesAndNotify();
|
||||
// } catch (error) {
|
||||
// console.log('Update check failed (suppressed):', error);
|
||||
// }
|
||||
// }
|
||||
```
|
||||
|
||||
## Troubleshooting
|
||||
|
||||
### Common Issues
|
||||
|
||||
1. **404 Errors**: Ensure repository URL is correct
|
||||
2. **Build Failures**: Check build configuration
|
||||
3. **Package Issues**: Verify package contents
|
||||
|
||||
### Debug Mode
|
||||
```bash
|
||||
# Enable debug logging
|
||||
DEBUG=* npm run build:electron:dev
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
**Status**: Auto-updates disabled
|
||||
**Last Updated**: 2025-07-12
|
||||
**Version**: 1.0
|
||||
**Maintainer**: Matthew Raymer
|
||||
181
docs/build-system/platforms/electron-build-scripts.md
Normal file
181
docs/build-system/platforms/electron-build-scripts.md
Normal file
@@ -0,0 +1,181 @@
|
||||
# Electron Build Scripts Guide
|
||||
|
||||
**Author**: Matthew Raymer
|
||||
**Date**: 2025-07-11
|
||||
**Status**: **ACTIVE** - Production Ready
|
||||
|
||||
## Overview
|
||||
|
||||
This document clarifies the difference between Electron build scripts that create executable packages versus those that run the app directly.
|
||||
|
||||
## Script Categories
|
||||
|
||||
### 🚀 **Development Scripts (Run App Directly)**
|
||||
|
||||
These scripts build the app and then run it immediately for development:
|
||||
|
||||
```bash
|
||||
# Development mode - runs app directly
|
||||
npm run build:electron:dev
|
||||
|
||||
# Test mode - runs app directly
|
||||
npm run build:electron:test
|
||||
|
||||
# Production mode - runs app directly
|
||||
npm run build:electron:prod
|
||||
```
|
||||
|
||||
### 📦 **Package Build Scripts (Create Executables)**
|
||||
|
||||
These scripts build executable packages that can be distributed and run by users:
|
||||
|
||||
#### **Platform-Specific Executables**
|
||||
```bash
|
||||
# Windows executable (.exe)
|
||||
npm run build:electron:windows
|
||||
npm run build:electron:windows:dev
|
||||
npm run build:electron:windows:test
|
||||
npm run build:electron:windows:prod
|
||||
|
||||
# macOS app bundle (.app)
|
||||
npm run build:electron:mac
|
||||
npm run build:electron:mac:dev
|
||||
npm run build:electron:mac:test
|
||||
npm run build:electron:mac:prod
|
||||
|
||||
# Linux executable
|
||||
npm run build:electron:linux
|
||||
npm run build:electron:linux:dev
|
||||
npm run build:electron:linux:test
|
||||
npm run build:electron:linux:prod
|
||||
```
|
||||
|
||||
#### **Package Formats**
|
||||
```bash
|
||||
# Linux AppImage (portable executable)
|
||||
npm run build:electron:appimage
|
||||
npm run build:electron:appimage:dev
|
||||
npm run build:electron:appimage:test
|
||||
npm run build:electron:appimage:prod
|
||||
|
||||
# Linux DEB package (installable)
|
||||
npm run build:electron:deb
|
||||
npm run build:electron:deb:dev
|
||||
npm run build:electron:deb:test
|
||||
npm run build:electron:deb:prod
|
||||
|
||||
# macOS DMG package (installable)
|
||||
npm run build:electron:dmg
|
||||
npm run build:electron:dmg:dev
|
||||
npm run build:electron:dmg:test
|
||||
npm run build:electron:dmg:prod
|
||||
```
|
||||
|
||||
## Output Locations
|
||||
|
||||
### **Development Scripts**
|
||||
- Run the app directly in development mode
|
||||
- No files created for distribution
|
||||
- App runs immediately after build
|
||||
|
||||
### **Package Scripts**
|
||||
- Create executable files in `electron/dist/`
|
||||
- Files can be distributed to users
|
||||
- Users can run the executables by hand
|
||||
|
||||
#### **Package Output Examples**
|
||||
```bash
|
||||
# AppImage
|
||||
electron/dist/TimeSafari-1.0.3-beta.AppImage
|
||||
|
||||
# DEB package
|
||||
electron/dist/TimeSafari_1.0.3-beta_amd64.deb
|
||||
|
||||
# DMG package
|
||||
electron/dist/TimeSafari-1.0.3-beta.dmg
|
||||
|
||||
# Windows executable
|
||||
electron/dist/TimeSafari Setup 1.0.3-beta.exe
|
||||
```
|
||||
|
||||
## Usage Examples
|
||||
|
||||
### **Development Workflow**
|
||||
```bash
|
||||
# Start development (runs app directly)
|
||||
npm run build:electron:dev
|
||||
|
||||
# Test with production build (runs app directly)
|
||||
npm run build:electron:test
|
||||
```
|
||||
|
||||
### **Distribution Workflow**
|
||||
```bash
|
||||
# Build AppImage for Linux distribution
|
||||
npm run build:electron:appimage:prod
|
||||
|
||||
# Build DMG for macOS distribution
|
||||
npm run build:electron:dmg:prod
|
||||
|
||||
# Build Windows installer
|
||||
npm run build:electron:windows:prod
|
||||
```
|
||||
|
||||
### **Testing Packages**
|
||||
```bash
|
||||
# Build test version of AppImage
|
||||
npm run build:electron:appimage:test
|
||||
|
||||
# Test the generated executable
|
||||
./electron/dist/TimeSafari-1.0.3-beta.AppImage
|
||||
```
|
||||
|
||||
## Key Differences
|
||||
|
||||
| Script Type | Purpose | Output | User Action |
|
||||
|-------------|---------|--------|-------------|
|
||||
| Development | Run app directly | None | App starts automatically |
|
||||
| Package | Create executable | `electron/dist/` | User runs executable by hand |
|
||||
|
||||
## Best Practices
|
||||
|
||||
### **For Development**
|
||||
- Use `npm run build:electron:dev` for daily development
|
||||
- Use `npm run build:electron:test` for testing production builds
|
||||
- App runs immediately after build
|
||||
|
||||
### **For Distribution**
|
||||
- Use `npm run build:electron:*:prod` for production packages
|
||||
- Test packages before distribution
|
||||
- Users install/run the generated executables
|
||||
|
||||
### **For Testing**
|
||||
- Use `npm run build:electron:*:test` for test packages
|
||||
- Verify executables work on target platforms
|
||||
- Test installation and uninstallation
|
||||
|
||||
## Troubleshooting
|
||||
|
||||
### **Package Build Issues**
|
||||
```bash
|
||||
# Check if package was created
|
||||
ls -la electron/dist/
|
||||
|
||||
# Verify package integrity
|
||||
file electron/dist/*.AppImage
|
||||
file electron/dist/*.deb
|
||||
file electron/dist/*.dmg
|
||||
```
|
||||
|
||||
### **Development Issues**
|
||||
```bash
|
||||
# Clean and rebuild
|
||||
npm run clean:electron
|
||||
npm run build:electron:dev
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
**Last Updated**: 2025-07-11
|
||||
**Version**: 1.0.3-beta
|
||||
**Status**: Production Ready
|
||||
436
docs/build-system/platforms/ios-build-scripts.md
Normal file
436
docs/build-system/platforms/ios-build-scripts.md
Normal file
@@ -0,0 +1,436 @@
|
||||
# iOS Build Scripts Documentation
|
||||
|
||||
**Author**: Matthew Raymer
|
||||
**Date**: 2025-07-11
|
||||
**Status**: ✅ **COMPLETE** - Full iOS build system integration
|
||||
|
||||
## Overview
|
||||
|
||||
The iOS build system for TimeSafari will provide comprehensive support for iOS mobile application development using Capacitor and Xcode. This system will support development, testing, and production environments with optimized builds for each use case.
|
||||
|
||||
**Note:** The iOS build system is now fully implemented and follows the same patterns as the Android and Electron build systems for consistency and maintainability.
|
||||
|
||||
## Build Script Integration
|
||||
|
||||
### Package.json Scripts
|
||||
|
||||
The iOS build system is fully integrated into `package.json` with the following scripts:
|
||||
|
||||
#### Basic Build Commands
|
||||
|
||||
```bash
|
||||
# Development builds (defaults to --mode development)
|
||||
npm run build:ios:dev # Development build
|
||||
npm run build:ios:test # Testing build
|
||||
npm run build:ios:prod # Production build
|
||||
```
|
||||
|
||||
#### Build Type Commands
|
||||
|
||||
```bash
|
||||
# Debug builds
|
||||
npm run build:ios:debug # Debug app build
|
||||
|
||||
# Release builds
|
||||
npm run build:ios:release # Release app build
|
||||
```
|
||||
|
||||
#### Specialized Commands
|
||||
|
||||
```bash
|
||||
# Xcode integration
|
||||
npm run build:ios:studio # Build + open Xcode
|
||||
|
||||
# Package builds
|
||||
npm run build:ios:ipa # Build IPA file
|
||||
npm run build:ios:app # Build app bundle
|
||||
|
||||
# Utility commands
|
||||
npm run build:ios:clean # Clean build artifacts only
|
||||
npm run build:ios:sync # Sync Capacitor only
|
||||
npm run build:ios:assets # Generate assets only
|
||||
```
|
||||
|
||||
#### Legacy Command
|
||||
|
||||
```bash
|
||||
# Original script (maintains backward compatibility)
|
||||
npm run build:ios # Full build process
|
||||
```
|
||||
|
||||
## Script Usage
|
||||
|
||||
### Direct Script Usage
|
||||
|
||||
The `build-ios.sh` script supports comprehensive command-line options:
|
||||
|
||||
```bash
|
||||
# Basic usage
|
||||
./scripts/build-ios.sh [options]
|
||||
|
||||
# Environment-specific builds
|
||||
./scripts/build-ios.sh --dev --studio # Development + open Xcode
|
||||
./scripts/build-ios.sh --test --ipa # Testing IPA build
|
||||
./scripts/build-ios.sh --prod --app # Production app build
|
||||
|
||||
# Utility operations
|
||||
./scripts/build-ios.sh --clean # Clean only
|
||||
./scripts/build-ios.sh --sync # Sync only
|
||||
./scripts/build-ios.sh --assets # Assets only
|
||||
```
|
||||
|
||||
### Command-Line Options
|
||||
|
||||
| Option | Description | Default |
|
||||
|--------|-------------|---------|
|
||||
| `--dev`, `--development` | Build for development environment | ✅ |
|
||||
| `--test` | Build for testing environment | |
|
||||
| `--prod`, `--production` | Build for production environment | |
|
||||
| `--debug` | Build debug app | ✅ |
|
||||
| `--release` | Build release app | |
|
||||
| `--studio` | Open Xcode after build | |
|
||||
| `--ipa` | Build IPA file | |
|
||||
| `--app` | Build app bundle | |
|
||||
| `--clean` | Clean build artifacts only | |
|
||||
| `--sync` | Sync Capacitor only | |
|
||||
| `--assets` | Generate assets only | |
|
||||
| `-h`, `--help` | Show help message | |
|
||||
| `-v`, `--verbose` | Enable verbose logging | |
|
||||
|
||||
## Build Process
|
||||
|
||||
### Complete Build Flow
|
||||
|
||||
1. **Resource Check**: Validate iOS resources
|
||||
2. **Cleanup**: Clean iOS app and build artifacts
|
||||
3. **Capacitor Build**: Build web assets with environment-specific mode
|
||||
4. **Xcode Clean**: Clean Xcode build cache
|
||||
5. **Xcode Build**: Build debug/release app
|
||||
6. **Capacitor Sync**: Sync web assets to iOS platform
|
||||
7. **Asset Generation**: Generate iOS-specific assets
|
||||
8. **Package Build**: Build IPA if requested
|
||||
9. **Xcode Launch**: Open Xcode if requested
|
||||
|
||||
### Environment-Specific Builds
|
||||
|
||||
#### Development Environment (`--dev`)
|
||||
|
||||
```bash
|
||||
# Uses --mode development
|
||||
npm run build:capacitor
|
||||
# Builds with development optimizations and debugging enabled
|
||||
```
|
||||
|
||||
#### Testing Environment (`--test`)
|
||||
|
||||
```bash
|
||||
# Uses --mode test
|
||||
npm run build:capacitor -- --mode test
|
||||
# Builds with testing configurations and test API endpoints
|
||||
```
|
||||
|
||||
#### Production Environment (`--prod`)
|
||||
|
||||
```bash
|
||||
# Uses --mode production
|
||||
npm run build:capacitor -- --mode production
|
||||
# Builds with production optimizations and live API endpoints
|
||||
```
|
||||
|
||||
## Build Artifacts
|
||||
|
||||
### App Files
|
||||
|
||||
- **Debug App**: `ios/App/build/Debug-iphonesimulator/App.app`
|
||||
- **Release App**: `ios/App/build/Release-iphoneos/App.app`
|
||||
|
||||
### IPA Files
|
||||
|
||||
- **Release IPA**: `ios/App/build/Release-iphoneos/App.ipa`
|
||||
|
||||
### Build Locations
|
||||
|
||||
```bash
|
||||
# App files
|
||||
ios/App/build/Debug-iphonesimulator/
|
||||
ios/App/build/Release-iphoneos/
|
||||
|
||||
# IPA files
|
||||
ios/App/build/Release-iphoneos/
|
||||
|
||||
# Xcode build cache
|
||||
ios/App/build/
|
||||
ios/App/DerivedData/
|
||||
```
|
||||
|
||||
## Environment Variables
|
||||
|
||||
The build system will automatically set environment variables based on the build type:
|
||||
|
||||
### Capacitor Environment
|
||||
|
||||
```bash
|
||||
VITE_PLATFORM=capacitor
|
||||
VITE_PWA_ENABLED=false
|
||||
VITE_DISABLE_PWA=true
|
||||
DEBUG_MIGRATIONS=0
|
||||
```
|
||||
|
||||
### Git Integration
|
||||
|
||||
```bash
|
||||
VITE_GIT_HASH=<git-commit-hash>
|
||||
# Automatically set from current git commit
|
||||
```
|
||||
|
||||
## Error Handling
|
||||
|
||||
### Exit Codes
|
||||
|
||||
| Code | Description |
|
||||
|------|-------------|
|
||||
| 1 | iOS cleanup failed |
|
||||
| 2 | Web build failed |
|
||||
| 3 | Capacitor build failed |
|
||||
| 4 | Xcode clean failed |
|
||||
| 5 | Xcode build failed |
|
||||
| 6 | Capacitor sync failed |
|
||||
| 7 | Asset generation failed |
|
||||
| 8 | Xcode open failed |
|
||||
|
||||
## iOS-Specific Features
|
||||
|
||||
### Simulator Support
|
||||
|
||||
```bash
|
||||
# Build for iOS Simulator
|
||||
npm run build:ios:dev --simulator
|
||||
|
||||
# Run on specific simulator
|
||||
xcrun simctl boot "iPhone 15 Pro"
|
||||
xcrun simctl install booted ios/App/build/Debug-iphonesimulator/App.app
|
||||
```
|
||||
|
||||
### Device Deployment
|
||||
|
||||
```bash
|
||||
# Build for physical device
|
||||
npm run build:ios:dev --device
|
||||
|
||||
# Install on connected device
|
||||
xcrun devicectl device install app --device <device-id> ios/App/build/Debug-iphoneos/App.app
|
||||
```
|
||||
|
||||
### Code Signing
|
||||
|
||||
```bash
|
||||
# Development signing
|
||||
npm run build:ios:dev --development-team <team-id>
|
||||
|
||||
# Distribution signing
|
||||
npm run build:ios:prod --distribution-certificate <cert-id>
|
||||
```
|
||||
|
||||
## Asset Generation
|
||||
|
||||
### iOS-Specific Assets
|
||||
|
||||
```bash
|
||||
# Generate iOS assets
|
||||
npx capacitor-assets generate --ios
|
||||
|
||||
# Assets generated
|
||||
ios/App/App/Assets.xcassets/
|
||||
├── AppIcon.appiconset/
|
||||
├── Splash.imageset/
|
||||
└── SplashDark.imageset/
|
||||
```
|
||||
|
||||
### Asset Requirements
|
||||
|
||||
- **App Icon**: 1024x1024 PNG (App Store requirement)
|
||||
- **Splash Screens**: Multiple sizes for different devices
|
||||
- **Launch Images**: Optimized for fast app startup
|
||||
|
||||
## Xcode Integration
|
||||
|
||||
### Xcode Project Structure
|
||||
|
||||
```bash
|
||||
ios/App/
|
||||
├── App.xcodeproj/ # Xcode project file
|
||||
├── App.xcworkspace/ # Xcode workspace
|
||||
├── App/ # iOS app source
|
||||
│ ├── AppDelegate.swift # App delegate
|
||||
│ ├── Info.plist # App configuration
|
||||
│ └── Assets.xcassets/ # App assets
|
||||
└── Podfile # CocoaPods dependencies
|
||||
```
|
||||
|
||||
### Xcode Build Configurations
|
||||
|
||||
- **Debug**: Development with debugging enabled
|
||||
- **Release**: Production with optimizations
|
||||
- **Ad Hoc**: Testing distribution
|
||||
- **App Store**: App Store distribution
|
||||
|
||||
## Development Workflow
|
||||
|
||||
### Daily Development
|
||||
|
||||
```bash
|
||||
# Development build
|
||||
npm run build:ios:dev
|
||||
|
||||
# Open in Xcode
|
||||
npm run build:ios:studio
|
||||
|
||||
# Run on simulator
|
||||
xcrun simctl launch booted app.timesafari.app
|
||||
```
|
||||
|
||||
### Testing Workflow
|
||||
|
||||
```bash
|
||||
# Test build
|
||||
npm run build:ios:test
|
||||
|
||||
# Run tests
|
||||
cd ios/App && xcodebuild test -workspace App.xcworkspace -scheme App -destination 'platform=iOS Simulator,name=iPhone 15 Pro'
|
||||
```
|
||||
|
||||
### Production Workflow
|
||||
|
||||
```bash
|
||||
# Production build
|
||||
npm run build:ios:prod
|
||||
|
||||
# Create IPA for distribution
|
||||
npm run build:ios:ipa:prod
|
||||
|
||||
# Upload to App Store Connect
|
||||
xcrun altool --upload-app -f ios/App/build/Release-iphoneos/App.ipa -t ios -u <apple-id> -p <app-specific-password>
|
||||
```
|
||||
|
||||
## Troubleshooting
|
||||
|
||||
### Common Issues
|
||||
|
||||
#### Build Failures
|
||||
```bash
|
||||
# Clean Xcode build
|
||||
cd ios/App && xcodebuild clean -workspace App.xcworkspace -scheme App
|
||||
|
||||
# Clean Capacitor
|
||||
npx cap clean ios
|
||||
|
||||
# Rebuild
|
||||
npm run build:ios:dev
|
||||
```
|
||||
|
||||
#### Simulator Issues
|
||||
```bash
|
||||
# Reset simulator
|
||||
xcrun simctl erase all
|
||||
|
||||
# List available simulators
|
||||
xcrun simctl list devices
|
||||
|
||||
# Boot specific simulator
|
||||
xcrun simctl boot "iPhone 15 Pro"
|
||||
```
|
||||
|
||||
#### Code Signing Issues
|
||||
```bash
|
||||
# Check certificates
|
||||
security find-identity -v -p codesigning
|
||||
|
||||
# Check provisioning profiles
|
||||
ls ~/Library/MobileDevice/Provisioning\ Profiles/
|
||||
```
|
||||
|
||||
### Debug Mode
|
||||
|
||||
Enable verbose logging for iOS builds:
|
||||
|
||||
```bash
|
||||
# Verbose mode
|
||||
./scripts/build-ios.sh --verbose
|
||||
|
||||
# Xcode verbose build
|
||||
cd ios/App && xcodebuild -workspace App.xcworkspace -scheme App -configuration Debug -verbose
|
||||
```
|
||||
|
||||
## Performance Considerations
|
||||
|
||||
### Build Performance
|
||||
|
||||
- **Incremental Builds**: Only rebuild changed files
|
||||
- **Parallel Processing**: Multi-core build optimization
|
||||
- **Caching**: Xcode build cache utilization
|
||||
- **Asset Optimization**: Image compression and optimization
|
||||
|
||||
### Runtime Performance
|
||||
|
||||
- **App Launch Time**: Optimized splash screens and assets
|
||||
- **Memory Usage**: Efficient image loading and caching
|
||||
- **Battery Life**: Background task optimization
|
||||
- **Network Performance**: Efficient API communication
|
||||
|
||||
## Security Considerations
|
||||
|
||||
### iOS Security Features
|
||||
|
||||
- **App Sandboxing**: Isolated app environment
|
||||
- **Code Signing**: Digital signature verification
|
||||
- **Entitlements**: Controlled access to system resources
|
||||
- **App Transport Security**: Secure network communication
|
||||
|
||||
### Build Security
|
||||
|
||||
- **Environment Isolation**: Separate dev/test/prod environments
|
||||
- **Secret Management**: Secure handling of API keys
|
||||
- **Dependency Scanning**: Regular security audits
|
||||
- **Code Signing**: Secure certificate management
|
||||
|
||||
## Future Enhancements
|
||||
|
||||
### Planned Features
|
||||
|
||||
- **CI/CD Integration**: Automated build pipelines
|
||||
- **Test Automation**: Automated testing framework
|
||||
- **Performance Monitoring**: Build and runtime performance tracking
|
||||
- **Asset Optimization**: Advanced image and code optimization
|
||||
|
||||
### Platform Expansion
|
||||
|
||||
- **App Store**: App Store distribution optimization
|
||||
- **TestFlight**: Beta testing integration
|
||||
- **Enterprise Distribution**: Enterprise app distribution
|
||||
- **Universal Links**: Deep linking support
|
||||
|
||||
## Current Status
|
||||
|
||||
### ✅ Phase 1: Foundation (Complete)
|
||||
- [x] Create `build-ios.sh` script
|
||||
- [x] Implement basic build functionality
|
||||
- [x] Add environment management
|
||||
- [x] Integrate with package.json
|
||||
|
||||
### ✅ Phase 2: Advanced Features (Complete)
|
||||
- [x] Add Xcode integration
|
||||
- [x] Implement asset generation
|
||||
- [x] Add simulator support
|
||||
- [x] Add device deployment
|
||||
|
||||
### ✅ Phase 3: Optimization (Complete)
|
||||
- [x] Performance optimization
|
||||
- [x] Error handling improvements
|
||||
- [x] Documentation completion
|
||||
- [x] Testing and validation
|
||||
|
||||
---
|
||||
|
||||
**Last Updated**: 2025-07-11
|
||||
**Version**: 1.0.3-beta
|
||||
**Status**: Production Ready
|
||||
164
docs/build-system/platforms/ios-simulator-build-and-icons.md
Normal file
164
docs/build-system/platforms/ios-simulator-build-and-icons.md
Normal file
@@ -0,0 +1,164 @@
|
||||
# iOS Simulator Build and App Icon Troubleshooting
|
||||
|
||||
**Author**: Matthew Raymer
|
||||
**Date**: 2025-07-12
|
||||
**Status**: 🎯 **ACTIVE** - In Use
|
||||
|
||||
## Overview
|
||||
|
||||
This guide documents how to build and run the TimeSafari iOS app in the
|
||||
simulator, and how to resolve common issues with iOS app icons and
|
||||
`AppIcon.appiconset` errors.
|
||||
|
||||
---
|
||||
|
||||
## Building and Running the iOS App in Simulator
|
||||
|
||||
### 1. Build the App
|
||||
|
||||
Use the npm script to build for development (debug/simulator):
|
||||
|
||||
```bash
|
||||
npm run build:ios:dev
|
||||
```
|
||||
|
||||
This prepares the iOS project for simulator deployment.
|
||||
|
||||
### 2. Run in Simulator
|
||||
|
||||
Use Capacitor to launch the app in the iOS Simulator:
|
||||
|
||||
```bash
|
||||
npx cap run ios
|
||||
```
|
||||
|
||||
This will:
|
||||
- Sync web assets
|
||||
- Build the native iOS app
|
||||
- Launch the iOS Simulator
|
||||
- Install and run the app
|
||||
|
||||
### 3. Open in Xcode (Optional)
|
||||
|
||||
To open the project in Xcode for manual simulator/device control:
|
||||
|
||||
```bash
|
||||
npm run build:ios:dev -- --studio
|
||||
```
|
||||
|
||||
Or:
|
||||
|
||||
```bash
|
||||
npx cap open ios
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Common App Icon and AppIcon.appiconset Errors
|
||||
|
||||
### Typical Error Message
|
||||
|
||||
```
|
||||
error: None of the input catalogs contained a matching stickers icon set or app
|
||||
icon set named "AppIcon".
|
||||
```
|
||||
|
||||
### Why This Happens
|
||||
|
||||
- The iOS build expects an `AppIcon.appiconset` in
|
||||
`ios/App/App/Assets.xcassets/`.
|
||||
- If missing or incomplete, the build fails.
|
||||
- The icon generator may also fail if the source icon is missing or invalid.
|
||||
|
||||
### Typical Causes
|
||||
|
||||
- No `AppIcon.appiconset` directory
|
||||
- No or invalid `Contents.json` in the icon set
|
||||
- Missing or corrupt `icon.png` in `assets/`
|
||||
- Generator tool errors (permissions, path, or file type)
|
||||
|
||||
---
|
||||
|
||||
## Step-by-Step: Generating iOS App Icons
|
||||
|
||||
### 1. Automatic Generation (Preferred)
|
||||
|
||||
- Place a valid PNG icon (at least 1024x1024) at `assets/icon.png`.
|
||||
- Run:
|
||||
|
||||
```bash
|
||||
npx capacitor-assets generate --ios
|
||||
```
|
||||
|
||||
- This should create `ios/App/App/Assets.xcassets/AppIcon.appiconset/` with all
|
||||
required icon sizes and a `Contents.json`.
|
||||
|
||||
#### Troubleshooting Automatic Generation
|
||||
|
||||
- If you see errors about missing directories, create them manually:
|
||||
|
||||
```bash
|
||||
mkdir -p ios/App/App/Assets.xcassets/AppIcon.appiconset
|
||||
```
|
||||
|
||||
- If you see errors about file type, ensure `icon.png` is a real PNG (not SVG).
|
||||
- If the generator fails with a TypeError, check for missing or corrupt files.
|
||||
|
||||
### 2. Manual Generation (Fallback)
|
||||
|
||||
- Use an online tool like [appicon.co](https://appicon.co/) to generate iOS
|
||||
icons from your `icon.png`.
|
||||
- Download and extract the zip.
|
||||
- Copy the contents into:
|
||||
|
||||
```
|
||||
ios/App/App/Assets.xcassets/AppIcon.appiconset/
|
||||
```
|
||||
|
||||
- Ensure the `Contents.json` is present and valid.
|
||||
|
||||
---
|
||||
|
||||
## Directory Structure
|
||||
|
||||
```
|
||||
ios/App/App/Assets.xcassets/
|
||||
└── AppIcon.appiconset/
|
||||
├── Contents.json
|
||||
├── AppIcon-20x20@2x.png
|
||||
├── AppIcon-20x20@3x.png
|
||||
├── ...
|
||||
└── AppIcon-1024x1024@1x.png
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Troubleshooting Checklist
|
||||
|
||||
- [ ] Is `assets/icon.png` present and a valid PNG?
|
||||
- [ ] Does `AppIcon.appiconset` exist in `Assets.xcassets`?
|
||||
- [ ] Is `Contents.json` present and correct?
|
||||
- [ ] Are all required icon PNGs present?
|
||||
- [ ] If using the generator, did it complete without errors?
|
||||
- [ ] If manual, did you copy all files from the zip?
|
||||
|
||||
---
|
||||
|
||||
## iOS Build Troubleshooting
|
||||
|
||||
- If the build fails with icon errors, fix the icon set and rebuild.
|
||||
- If the simulator does not launch, try running:
|
||||
|
||||
```bash
|
||||
npx cap open ios
|
||||
```
|
||||
|
||||
and launch from Xcode.
|
||||
|
||||
- For other build errors, check the logs for missing files or permissions.
|
||||
|
||||
---
|
||||
|
||||
**Status**: In Use
|
||||
**Last Updated**: 2025-07-12
|
||||
**Maintainer**: Matthew Raymer
|
||||
535
docs/build-system/platforms/web-build-scripts.md
Normal file
535
docs/build-system/platforms/web-build-scripts.md
Normal file
@@ -0,0 +1,535 @@
|
||||
# Web Build Scripts Documentation
|
||||
|
||||
**Author**: Matthew Raymer
|
||||
**Date**: 2025-07-11
|
||||
**Status**: ✅ **COMPLETE** - Full web build system with PWA and Docker support
|
||||
|
||||
## Overview
|
||||
|
||||
The web build system for TimeSafari provides comprehensive support for web application development, PWA functionality, and containerized deployment. It supports development, testing, and production environments with optimized builds for each use case.
|
||||
|
||||
## Build Script Integration
|
||||
|
||||
### Package.json Scripts
|
||||
|
||||
The web build system is fully integrated into `package.json` with the following scripts:
|
||||
|
||||
#### Basic Build Commands
|
||||
|
||||
```bash
|
||||
# Development (starts dev server)
|
||||
npm run build:web:dev # Development server with hot reload
|
||||
|
||||
# Production builds
|
||||
npm run build:web:test # Testing environment build
|
||||
npm run build:web:prod # Production environment build
|
||||
```
|
||||
|
||||
#### Docker Integration
|
||||
|
||||
```bash
|
||||
# Docker builds
|
||||
npm run build:web:docker # Development + Docker
|
||||
npm run build:web:docker:test # Testing + Docker
|
||||
npm run build:web:docker:prod # Production + Docker
|
||||
```
|
||||
|
||||
#### Utility Commands
|
||||
|
||||
```bash
|
||||
# Serve built files locally
|
||||
npm run build:web:serve # Build and serve locally
|
||||
|
||||
# Legacy command (maintains compatibility)
|
||||
npm run build:web # Full build process
|
||||
```
|
||||
|
||||
## Script Usage
|
||||
|
||||
### Direct Script Usage
|
||||
|
||||
The `build-web.sh` script supports comprehensive command-line options:
|
||||
|
||||
```bash
|
||||
# Basic usage
|
||||
./scripts/build-web.sh [options]
|
||||
|
||||
# Environment-specific builds
|
||||
./scripts/build-web.sh --dev # Development server
|
||||
./scripts/build-web.sh --test # Testing build
|
||||
./scripts/build-web.sh --prod # Production build
|
||||
|
||||
# Docker integration
|
||||
./scripts/build-web.sh --docker # Development + Docker
|
||||
./scripts/build-web.sh --docker:test # Testing + Docker
|
||||
./scripts/build-web.sh --docker:prod # Production + Docker
|
||||
|
||||
# Local serving
|
||||
./scripts/build-web.sh --serve # Build and serve locally
|
||||
```
|
||||
|
||||
### Command-Line Options
|
||||
|
||||
| Option | Description | Default |
|
||||
|--------|-------------|---------|
|
||||
| `--dev`, `--development` | Development mode (starts dev server) | ✅ |
|
||||
| `--test` | Testing environment build | |
|
||||
| `--prod`, `--production` | Production environment build | |
|
||||
| `--docker` | Build and create Docker image | |
|
||||
| `--docker:test` | Testing environment + Docker | |
|
||||
| `--docker:prod` | Production environment + Docker | |
|
||||
| `--serve` | Build and serve locally | |
|
||||
| `-h`, `--help` | Show help message | |
|
||||
| `-v`, `--verbose` | Enable verbose logging | |
|
||||
|
||||
## Build Process
|
||||
|
||||
### Development Mode Flow
|
||||
|
||||
1. **Environment Setup**: Load development environment variables
|
||||
2. **Validation**: Check for required dependencies
|
||||
3. **Server Start**: Start Vite development server
|
||||
4. **Hot Reload**: Enable live reload and HMR
|
||||
5. **PWA Setup**: Configure PWA for development
|
||||
|
||||
### Production Mode Flow
|
||||
|
||||
1. **Environment Setup**: Load production environment variables
|
||||
2. **Cleanup**: Clean previous build artifacts
|
||||
3. **Asset Optimization**: Optimize images and code
|
||||
4. **Build Process**: Run Vite production build
|
||||
5. **PWA Generation**: Generate service worker and manifest
|
||||
6. **Output**: Create optimized static files
|
||||
|
||||
### Docker Mode Flow
|
||||
|
||||
1. **Build Process**: Run production build
|
||||
2. **Docker Build**: Create Docker image
|
||||
3. **Image Tagging**: Tag with environment and version
|
||||
4. **Output**: Ready-to-deploy container
|
||||
|
||||
## Environment Management
|
||||
|
||||
### Environment Variables
|
||||
|
||||
The web build system automatically sets environment variables:
|
||||
|
||||
```bash
|
||||
# Platform configuration
|
||||
VITE_PLATFORM=web
|
||||
VITE_PWA_ENABLED=true
|
||||
VITE_DISABLE_PWA=false
|
||||
|
||||
# Build information
|
||||
VITE_GIT_HASH=<git-commit-hash>
|
||||
DEBUG_MIGRATIONS=0
|
||||
```
|
||||
|
||||
### Environment Files
|
||||
|
||||
```bash
|
||||
.env.development # Development environment
|
||||
.env.test # Testing environment
|
||||
.env.production # Production environment
|
||||
```
|
||||
|
||||
### Mode-Specific Configuration
|
||||
|
||||
#### Development Mode
|
||||
```bash
|
||||
# Uses .env.development
|
||||
VITE_DEFAULT_ENDORSER_API_SERVER=http://127.0.0.1:3000
|
||||
VITE_PWA_ENABLED=true
|
||||
```
|
||||
|
||||
#### Test Mode
|
||||
```bash
|
||||
# Uses .env.test
|
||||
VITE_DEFAULT_ENDORSER_API_SERVER=https://test-api.timesafari.org
|
||||
VITE_PWA_ENABLED=true
|
||||
```
|
||||
|
||||
#### Production Mode
|
||||
```bash
|
||||
# Uses .env.production
|
||||
VITE_DEFAULT_ENDORSER_API_SERVER=https://api.timesafari.org
|
||||
VITE_PWA_ENABLED=true
|
||||
```
|
||||
|
||||
## PWA (Progressive Web App) Features
|
||||
|
||||
### PWA Configuration
|
||||
|
||||
TimeSafari implements comprehensive PWA functionality across all environments:
|
||||
|
||||
#### ✅ **Development Mode PWA**
|
||||
- Service worker registration active
|
||||
- Manifest generation enabled
|
||||
- Hot reload compatible
|
||||
- Development testing of PWA features
|
||||
|
||||
#### ✅ **Test Mode PWA**
|
||||
- Full PWA feature testing
|
||||
- Service worker registration active
|
||||
- Manifest generation enabled
|
||||
- QA testing of PWA functionality
|
||||
|
||||
#### ✅ **Production Mode PWA**
|
||||
- Full caching strategies
|
||||
- Service worker registration active
|
||||
- Manifest generation enabled
|
||||
- Runtime caching for API calls
|
||||
- Optimized for production performance
|
||||
|
||||
### PWA Assets Generated
|
||||
|
||||
```bash
|
||||
dist/
|
||||
├── manifest.webmanifest # PWA manifest with app metadata
|
||||
├── sw.js # Service worker for offline functionality
|
||||
├── workbox-*.js # Workbox library for caching strategies
|
||||
└── assets/
|
||||
├── icons/ # PWA icons in various sizes
|
||||
└── splash/ # Splash screen images
|
||||
```
|
||||
|
||||
### PWA Features
|
||||
|
||||
- **Offline Support**: Service worker caches essential resources
|
||||
- **App Installation**: Browser install prompts
|
||||
- **Share Target**: Image sharing integration
|
||||
- **Background Sync**: Offline data synchronization
|
||||
- **Push Notifications**: Web push notification support
|
||||
|
||||
### PWA Manifest
|
||||
|
||||
```json
|
||||
{
|
||||
"name": "TimeSafari",
|
||||
"short_name": "TimeSafari",
|
||||
"description": "Crowd-Funder for Time",
|
||||
"start_url": "/",
|
||||
"display": "standalone",
|
||||
"background_color": "#ffffff",
|
||||
"theme_color": "#4f46e5",
|
||||
"icons": [
|
||||
{
|
||||
"src": "assets/icons/icon-192x192.png",
|
||||
"sizes": "192x192",
|
||||
"type": "image/png"
|
||||
}
|
||||
]
|
||||
}
|
||||
```
|
||||
|
||||
## Docker Integration
|
||||
|
||||
### Docker Build Process
|
||||
|
||||
The web build system includes comprehensive Docker support:
|
||||
|
||||
```bash
|
||||
# Development Docker
|
||||
./scripts/build-web.sh --docker
|
||||
|
||||
# Testing Docker
|
||||
./scripts/build-web.sh --docker:test
|
||||
|
||||
# Production Docker
|
||||
./scripts/build-web.sh --docker:prod
|
||||
```
|
||||
|
||||
### Docker Features
|
||||
|
||||
- **Automatic Image Tagging**: `timesafari-web:mode`
|
||||
- **Build Argument Passing**: Environment-specific configurations
|
||||
- **Multi-Stage Builds**: Optimized production images
|
||||
- **Health Checks**: Container health monitoring
|
||||
- **Security Scanning**: Vulnerability assessment
|
||||
|
||||
### Docker Output
|
||||
|
||||
```bash
|
||||
# Generated Docker images
|
||||
timesafari-web:development
|
||||
timesafari-web:test
|
||||
timesafari-web:production
|
||||
```
|
||||
|
||||
### Docker Usage
|
||||
|
||||
```bash
|
||||
# Run development container
|
||||
docker run -p 8080:80 timesafari-web:development
|
||||
|
||||
# Run production container
|
||||
docker run -p 8080:80 timesafari-web:production
|
||||
|
||||
# Deploy to container registry
|
||||
docker push timesafari-web:production
|
||||
```
|
||||
|
||||
## Build Artifacts
|
||||
|
||||
### Development Mode
|
||||
|
||||
- **No files created**: Runs development server directly
|
||||
- **Server URL**: http://localhost:8080
|
||||
- **Hot Reload**: Enabled with Vite HMR
|
||||
- **Source Maps**: Enabled for debugging
|
||||
|
||||
### Production Mode
|
||||
|
||||
```bash
|
||||
dist/
|
||||
├── index.html # Main HTML file
|
||||
├── manifest.webmanifest # PWA manifest
|
||||
├── sw.js # Service worker
|
||||
├── workbox-*.js # Workbox library
|
||||
└── assets/
|
||||
├── index-*.js # Main application bundle
|
||||
├── index-*.css # Stylesheet bundle
|
||||
├── icons/ # PWA icons
|
||||
└── images/ # Optimized images
|
||||
```
|
||||
|
||||
### File Sizes (Typical)
|
||||
|
||||
| File Type | Development | Production | Gzipped |
|
||||
|-----------|-------------|------------|---------|
|
||||
| **Main Bundle** | 2.1MB | 850KB | 250KB |
|
||||
| **CSS Bundle** | 180KB | 45KB | 12KB |
|
||||
| **PWA Assets** | 50KB | 50KB | 15KB |
|
||||
| **Total** | 2.3MB | 945KB | 277KB |
|
||||
|
||||
## Performance Optimization
|
||||
|
||||
### Build Optimizations
|
||||
|
||||
- **Code Splitting**: Automatic route-based splitting
|
||||
- **Tree Shaking**: Unused code elimination
|
||||
- **Minification**: JavaScript and CSS compression
|
||||
- **Asset Optimization**: Image compression and optimization
|
||||
- **Caching**: Long-term caching for static assets
|
||||
|
||||
### Runtime Optimizations
|
||||
|
||||
- **Service Worker**: Offline caching and background sync
|
||||
- **Lazy Loading**: Component and route lazy loading
|
||||
- **Preloading**: Critical resource preloading
|
||||
- **Compression**: Gzip/Brotli compression support
|
||||
|
||||
### Performance Metrics
|
||||
|
||||
```bash
|
||||
# Development startup time
|
||||
~350ms (Vite dev server)
|
||||
|
||||
# Production build time
|
||||
~8s (full build)
|
||||
~2s (incremental build)
|
||||
|
||||
# Production bundle size
|
||||
~945KB (total)
|
||||
~277KB (gzipped)
|
||||
```
|
||||
|
||||
## Development Workflow
|
||||
|
||||
### Daily Development
|
||||
|
||||
```bash
|
||||
# Start development server
|
||||
npm run build:web:dev
|
||||
|
||||
# Access at http://localhost:8080
|
||||
# Hot reload enabled
|
||||
# PWA features available
|
||||
```
|
||||
|
||||
### Testing Workflow
|
||||
|
||||
```bash
|
||||
# Build for testing
|
||||
npm run build:web:test
|
||||
|
||||
# Test PWA functionality
|
||||
# Verify offline support
|
||||
# Test app installation
|
||||
```
|
||||
|
||||
### Production Workflow
|
||||
|
||||
```bash
|
||||
# Build for production
|
||||
npm run build:web:prod
|
||||
|
||||
# Deploy to web server
|
||||
# Or create Docker image
|
||||
npm run build:web:docker:prod
|
||||
```
|
||||
|
||||
## Local Development Server
|
||||
|
||||
### Development Server Features
|
||||
|
||||
- **Hot Module Replacement**: Instant updates without page refresh
|
||||
- **Fast Refresh**: React-style fast refresh for Vue components
|
||||
- **Source Maps**: Full debugging support
|
||||
- **PWA Support**: Service worker and manifest in development
|
||||
- **Error Overlay**: In-browser error reporting
|
||||
|
||||
### Server Configuration
|
||||
|
||||
```bash
|
||||
# Development server settings
|
||||
Port: 8080
|
||||
Host: localhost
|
||||
Protocol: http
|
||||
HMR: enabled
|
||||
Source Maps: enabled
|
||||
PWA: enabled
|
||||
```
|
||||
|
||||
### Accessing the Server
|
||||
|
||||
```bash
|
||||
# Local development
|
||||
http://localhost:8080
|
||||
|
||||
# Network access (if needed)
|
||||
http://0.0.0.0:8080
|
||||
```
|
||||
|
||||
## Troubleshooting
|
||||
|
||||
### Common Issues
|
||||
|
||||
#### Build Failures
|
||||
```bash
|
||||
# Clean build artifacts
|
||||
rm -rf dist/
|
||||
|
||||
# Reinstall dependencies
|
||||
npm install
|
||||
|
||||
# Rebuild
|
||||
npm run build:web:prod
|
||||
```
|
||||
|
||||
#### Development Server Issues
|
||||
```bash
|
||||
# Check port availability
|
||||
lsof -i :8080
|
||||
|
||||
# Kill existing process
|
||||
kill -9 <PID>
|
||||
|
||||
# Restart server
|
||||
npm run build:web:dev
|
||||
```
|
||||
|
||||
#### PWA Issues
|
||||
```bash
|
||||
# Clear service worker
|
||||
# In browser DevTools > Application > Service Workers
|
||||
# Click "Unregister"
|
||||
|
||||
# Clear browser cache
|
||||
# In browser DevTools > Application > Storage
|
||||
# Click "Clear site data"
|
||||
```
|
||||
|
||||
### Debug Mode
|
||||
|
||||
Enable verbose logging for web builds:
|
||||
|
||||
```bash
|
||||
# Verbose mode
|
||||
./scripts/build-web.sh --verbose
|
||||
|
||||
# Debug environment
|
||||
DEBUG_MIGRATIONS=1 npm run build:web:dev
|
||||
```
|
||||
|
||||
### Performance Debugging
|
||||
|
||||
```bash
|
||||
# Analyze bundle size
|
||||
npm run build:web:prod
|
||||
# Check dist/ directory for file sizes
|
||||
|
||||
# Analyze performance
|
||||
# Use browser DevTools > Performance tab
|
||||
# Use Lighthouse for PWA metrics
|
||||
```
|
||||
|
||||
## Security Considerations
|
||||
|
||||
### Build Security
|
||||
|
||||
- **Environment Isolation**: Separate dev/test/prod environments
|
||||
- **Secret Management**: Secure handling of API keys
|
||||
- **Dependency Scanning**: Regular security audits
|
||||
- **Content Security Policy**: CSP headers for security
|
||||
|
||||
### Runtime Security
|
||||
|
||||
- **HTTPS Only**: Production requires HTTPS
|
||||
- **CSP Headers**: Content Security Policy enforcement
|
||||
- **Service Worker Security**: Secure service worker implementation
|
||||
- **API Security**: Secure API communication
|
||||
|
||||
## Deployment Options
|
||||
|
||||
### Static Hosting
|
||||
|
||||
```bash
|
||||
# Build for production
|
||||
npm run build:web:prod
|
||||
|
||||
# Deploy to static host
|
||||
# Upload dist/ directory to web server
|
||||
```
|
||||
|
||||
### Docker Deployment
|
||||
|
||||
```bash
|
||||
# Build Docker image
|
||||
npm run build:web:docker:prod
|
||||
|
||||
# Deploy to container platform
|
||||
docker run -p 80:80 timesafari-web:production
|
||||
```
|
||||
|
||||
### CDN Deployment
|
||||
|
||||
```bash
|
||||
# Build for production
|
||||
npm run build:web:prod
|
||||
|
||||
# Upload to CDN
|
||||
# Configure CDN for PWA support
|
||||
```
|
||||
|
||||
## Future Enhancements
|
||||
|
||||
### Planned Improvements
|
||||
|
||||
- **Advanced Caching**: Intelligent caching strategies
|
||||
- **Performance Monitoring**: Real-time performance tracking
|
||||
- **A/B Testing**: Feature flag support
|
||||
- **Analytics Integration**: User behavior tracking
|
||||
|
||||
### PWA Enhancements
|
||||
|
||||
- **Background Sync**: Enhanced offline synchronization
|
||||
- **Push Notifications**: Advanced notification features
|
||||
- **App Shortcuts**: Quick action shortcuts
|
||||
- **File Handling**: Native file integration
|
||||
|
||||
---
|
||||
|
||||
**Last Updated**: 2025-07-11
|
||||
**Version**: 1.0.3-beta
|
||||
**Status**: Production Ready
|
||||
Reference in New Issue
Block a user