# Quick Start - Tạo Icons & Fix Lỗi

## 🔧 Fix lỗi npm install

Lỗi: `@types/chrome@^0.0.0` không tồn tại

**Đã fix**: Đổi version thành `@types/chrome@^0.0.268` trong `package.json`

Bây giờ chạy lại:
```bash
cd extension
npm install
```

---

## 🎨 Tạo Icons (3 cách)

### Cách 1: Dùng HTML Generator (Dễ nhất) ⭐

1. Mở file `scripts/create-icons-simple.html` trong browser
2. Click button "Generate Icons"
3. Icons sẽ tự động download
4. Copy 3 file PNG vào folder `extension/icons/`

### Cách 2: Dùng Python Script

```bash
# Install Pillow
pip install Pillow

# Run script
cd extension
python scripts/create-icons-simple.py
```

### Cách 3: Tạo thủ công

1. Tạo 3 file PNG:
   - `icon16.png` (16x16 pixels)
   - `icon48.png` (48x48 pixels)
   - `icon128.png` (128x128 pixels)
2. Design đơn giản: Background màu #4F46E5, chữ "CN" màu trắng
3. Save vào `extension/icons/`

---

## ✅ Sau khi có icons

1. **Install dependencies**:
   ```bash
   cd extension
   npm install
   ```

2. **Build extension**:
   ```bash
   npm run build
   ```

3. **Load vào Chrome**:
   - Mở `chrome://extensions`
   - Bật "Developer mode"
   - Click "Load unpacked"
   - Chọn folder `extension/dist`

4. **Test**:
   - Mở một trang web
   - Bôi đen text
   - Popup "💾 Save to CuCu Note" sẽ hiện!

---

## 🐛 Nếu vẫn lỗi

### Lỗi build:
- Check `tsconfig.json` có đúng không
- Check `vite.config.ts` có đúng không
- Xem console khi build: `npm run build`

### Extension không load:
- Check `manifest.json` có đúng format không
- Check icons có đủ 3 file không
- Xem errors trong `chrome://extensions` → "Errors"

### Popup không hiện:
- Check Console trong DevTools (F12)
- Check content script có inject không
- Check permissions trong manifest.json

