# 🚀 Panduan Build untuk Production

## 📋 Masalah yang Diselesaikan

Aplikasi ini memiliki **banyak file JS dan CSS** yang harus dibangun semuanya karena:
- Setiap halaman memerlukan file JS/CSS yang spesifik
- Jika ada file yang hilang, halaman akan error (404 Not Found)
- Server dengan RAM terbatas sering mengalami "killed" saat build

## 🎯 Solusi yang Tersedia

### 1. **Build di Local (RECOMMENDED) 🏆**
```bash
# Build di local computer Anda
npm run build:local

# Upload ke server
./deploy.sh username server.com /path/to/project
```

**Kelebihan:**
- ✅ Tidak ada batasan memory
- ✅ Build lebih cepat
- ✅ Semua file terjamin ter-build

### 2. **Build di Server dengan Optimasi**
```bash
# Option A: Build dengan memory optimization
npm run build:prod

# Option B: Build dengan retry mechanism
npm run build:chunked

# Option C: Build manual dengan script
./build-production.sh
```

### 3. **Setup Server untuk Build**
```bash
# Setup swap memory dan optimasi (run dengan sudo)
sudo ./server-setup.sh

# Kemudian build
npm run build:prod
```

## 📁 File yang Akan Dibangun

Semua file ini **WAJIB** ada karena dibutuhkan oleh halaman-halaman aplikasi:

### CSS Files:
- `resources/scss/style.scss` - Main stylesheet
- `resources/scss/icons.scss` - Icons
- `resources/scss/components/_*.scss` - Components
- `resources/scss/dashboards/_*.scss` - Dashboard styles
- `resources/scss/pages/quick-search/*.scss` - Quick search pages
- Third-party CSS (Quill, Flatpickr, GridJS, dll)

### JS Files:
- **Core:** `app.js`, `config.js`, `dashboard.js`
- **Pages:** `chart.js`, `form-*.js`, `table-*.js`, `maps-*.js`  
- **Data:** `data-advertisements.js`, `data-umkm.js`, `data-tourisms.js`
- **Settings:** `syncronize.js`, `general-settings.js`
- **Dashboards:** `bigdata.js`, `pbg.js`, `potentials/*.js`
- **Users & Roles:** `users/*.js`, `roles/*.js`, `menus/*.js`
- **Reports:** `growth-report.js`, `tourisms/index.js`
- **Dan semua file lainnya sesuai kebutuhan halaman**

## ⚙️ Konfigurasi Build

### Memory Optimization
```javascript
// vite.config.production.js
export default defineConfig({
    build: {
        rollupOptions: {
            output: {
                manualChunks: {
                    vendor: ['bootstrap', 'moment', 'axios'],
                    charts: ['apexcharts'],
                    maps: ['leaflet', 'jsvectormap', 'gmaps'],
                    ui: ['sweetalert2', 'flatpickr', 'quill']
                }
            },
            maxParallelFileOps: 1 // Untuk server dengan RAM terbatas
        }
    }
})
```

### Memory Limits
```bash
# Untuk server dengan RAM 2GB+
NODE_OPTIONS="--max-old-space-size=2048"

# Untuk server dengan RAM 1GB
NODE_OPTIONS="--max-old-space-size=1024"
```

## 🔧 Troubleshooting

### Build Terkill (Killed)
```bash
# Solusi 1: Build di local
npm run build:local
./deploy.sh

# Solusi 2: Tambah swap memory
sudo ./server-setup.sh

# Solusi 3: Gunakan build chunked
npm run build:chunked
```

### File JS/CSS Tidak Ditemukan
```bash
# Pastikan semua file ada di vite.config.production.js
# Jangan hapus file apapun dari daftar input!

# Verifikasi build
find public/build -name "*.js" | wc -l
find public/build -name "*.css" | wc -l
```

### Server Kehabisan Memory
```bash
# Check memory usage
free -h

# Add swap file
sudo fallocate -l 2G /swapfile
sudo chmod 600 /swapfile
sudo mkswap /swapfile
sudo swapon /swapfile
```

## 📦 Deployment Flow

### Local Build → Server Deploy
```bash
# 1. Di local
npm ci
npm run build:local

# 2. Edit deploy.sh dengan info server
# 3. Deploy
./deploy.sh username server.com /path/to/project
```

### Server Build
```bash
# 1. Setup server
sudo ./server-setup.sh

# 2. Install dependencies
npm ci --production=false

# 3. Build
npm run build:chunked

# 4. Optimize Laravel
php artisan config:cache
php artisan route:cache
php artisan view:cache
```

## ⚠️ Catatan Penting

1. **JANGAN HAPUS FILE APAPUN** dari `vite.config.production.js`
2. **SEMUA FILE WAJIB ADA** karena dibutuhkan oleh halaman-halaman aplikasi
3. **BUILD DI LOCAL** adalah solusi terbaik untuk server dengan RAM terbatas
4. **BACKUP** selalu sebelum deploy ke production

## 🎉 Success Indicators

Build berhasil jika:
- ✅ File `public/build/manifest.json` ada
- ✅ Folder `public/build/assets/` berisi banyak file JS/CSS
- ✅ Tidak ada error 404 saat mengakses halaman
- ✅ Semua halaman dapat memuat JS/CSS yang dibutuhkan