# Vendor Libraries (第三方库)

本目录包含所有第三方JavaScript和CSS库的本地副本，避免依赖外部CDN。

## 📦 已包含的库

### 1. **Bootstrap 5.x**
- **文件**: `bootstrap/bootstrap.min.css`, `bootstrap/bootstrap.bundle.min.js`
- **用途**: UI框架，提供响应式布局和组件
- **原始来源**: https://getbootstrap.com/

### 2. **jQuery 3.x**
- **文件**: `jquery/jquery.min.js`
- **用途**: JavaScript工具库
- **原始来源**: https://jquery.com/

### 3. **Font Awesome 6.x**
- **文件**: `fontawesome/all.min.css`, `fontawesome/webfonts/*`
- **用途**: 图标库
- **原始来源**: https://fontawesome.com/

### 4. **Highlight.js**
- **文件**: `highlightjs/*.min.js`, `highlightjs/github.min.css`
- **用途**: 代码语法高亮
- **支持语言**: JavaScript, Python, PHP, SQL
- **原始来源**: https://highlightjs.org/

### 5. **Marked.js**
- **文件**: `marked/marked.min.js`
- **用途**: Markdown解析器
- **原始来源**: https://marked.js.org/

### 6. **GitHub Markdown CSS**
- **文件**: `github-markdown.min.css`
- **用途**: GitHub风格的Markdown样式
- **原始来源**: https://github.com/sindresorhus/github-markdown-css

### 7. **SweetAlert2**
- **文件**: `sweetalert2/sweetalert2.all.min.js`
- **版本**: 11.x
- **用途**: 美化的弹窗提示库
- **原始来源**: https://sweetalert2.github.io/
- **CDN**: https://cdn.jsdelivr.net/npm/sweetalert2@11

### 8. **Animate.css**
- **文件**: `animate.css/animate.min.css`
- **版本**: 4.1.1
- **用途**: CSS动画库
- **原始来源**: https://animate.style/
- **CDN**: https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css

## 🔄 更新库版本

如需更新某个库，请按以下步骤操作：

### 方法1: 手动下载
```bash
# 示例：更新SweetAlert2
curl -L "https://cdn.jsdelivr.net/npm/sweetalert2@11/dist/sweetalert2.all.min.js" \
  -o ctf/app/static/vendor/sweetalert2/sweetalert2.all.min.js

# 示例：更新Animate.css
curl -L "https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css" \
  -o ctf/app/static/vendor/animate.css/animate.min.css
```

### 方法2: 使用npm（如果有package.json）
```bash
npm install sweetalert2@latest
cp node_modules/sweetalert2/dist/sweetalert2.all.min.js ctf/app/static/vendor/sweetalert2/
```

## ✅ 优势

1. **加载速度快** - 无需访问外部CDN，特别是在国内网络环境
2. **离线可用** - 不依赖外部网络
3. **版本稳定** - 不会因CDN更新导致兼容性问题
4. **安全性高** - 避免CDN被劫持或污染
5. **可控性强** - 完全掌控第三方库的版本

## 📝 使用示例

### HTML模板中引用
```html
<!-- SweetAlert2 -->
<script src="{{ url_for('static', filename='vendor/sweetalert2/sweetalert2.all.min.js') }}"></script>

<!-- Animate.css -->
<link href="{{ url_for('static', filename='vendor/animate.css/animate.min.css') }}" rel="stylesheet">
```

## 🚫 已移除的CDN引用

以下CDN引用已被本地文件替换：

- ❌ `https://cdn.jsdelivr.net/npm/sweetalert2@11`
  - ✅ 替换为: `vendor/sweetalert2/sweetalert2.all.min.js`

- ❌ `https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css`
  - ✅ 替换为: `vendor/animate.css/animate.min.css`

## 📊 文件大小

| 库 | 文件 | 大小 |
|----|------|------|
| Bootstrap CSS | bootstrap.min.css | 160KB |
| Bootstrap JS | bootstrap.bundle.min.js | 76KB |
| jQuery | jquery.min.js | 87KB |
| Font Awesome | all.min.css | 58KB |
| Highlight.js | highlight.min.js | 118KB |
| Marked.js | marked.min.js | 39KB |
| GitHub Markdown | github-markdown.min.css | 26KB |
| SweetAlert2 | sweetalert2.all.min.js | 77KB |
| Animate.css | animate.min.css | 70KB |

**总计**: ~711KB (已压缩)

## 🔍 检查外部依赖

使用以下命令检查是否还有外部CDN引用：

```bash
# 检查HTML模板
grep -r "cdn\." ctf/app/templates --include="*.html"

# 检查CSS文件
grep -r "url(http" ctf/app/static/css --include="*.css"
```

## 📅 最后更新

- **SweetAlert2**: 2025-11-23 (v11.x)
- **Animate.css**: 2025-11-23 (v4.1.1)
- **其他库**: 2025-03-27