pos-system/apps/client-example/docs/FAVICON_SIMPLE_FIX.md

🔧 Favicon 500 Error - Simple Fix

❌ Vấn đề:

GET /favicon.ico → 500 Internal Server Error

✅ Nguyên nhân:

File favicon.ico chứa SVG content thay vì format ICO đúng.

🛠️ Giải pháp (Cực đơn giản):

1. Xóa file ICO bị lỗi:

# Đã xóa:
- client/public/favicon.ico
- client/src/app/favicon.ico

2. Dùng SVG từ public/:

client/public/
├── favicon.svg           ✅ NextJS tự serve
└── apple-touch-icon.svg  ✅ NextJS tự serve

3. Update metadata:

// src/app/layout.tsx
export const metadata = {
  icons: {
    icon: '/favicon.svg',
    apple: '/apple-touch-icon.svg',
  },
};

✅ Kết quả:

✅ favicon.svg:           200 OK
✅ apple-touch-icon.svg:  200 OK
✅ Homepage:              200 OK

Xong! Không cần route handlers, không cần config phức tạp.

NextJS tự động serve static files từ public/. SVG modern browsers đều support.

---

🎉 Fixed! Clear cache (Cmd+Shift+R) và reload để see favicon.