# github-trending-plugin

**Repository Path**: cloud-aios/github-trending-plugin

## Basic Information

- **Project Name**: github-trending-plugin
- **Description**: No description available
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: main
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-11-04
- **Last Updated**: 2025-11-04

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# GitHub Trending 插件

这是一个Chrome浏览器扩展，用于展示GitHub上当天最热门的trending仓库信息。该扩展使用Manifest V3规范开发。

## 功能特点

- 爬取并解析 GitHub Trending 页面 (https://github.com/trending)
- 展示热门项目的详细信息，包括：
  - 项目名称
  - 项目描述
  - Stars总数
  - 今日新增Stars数
  - Follow数
  - 项目URL
- 点击项目可直接跳转到对应的GitHub仓库页面
- 简洁明了的UI设计，采用大厂设计风格和配色方案
- 支持数据自动刷新

## 安装方法

### 从Chrome Web Store安装
1. 访问Chrome Web Store（即将上架）
2. 点击"添加至Chrome"按钮

### 手动安装（开发者模式）
1. 下载或克隆本仓库
2. 创建图标文件（见下方"生成图标"部分）
3. 打开Chrome浏览器，访问 `chrome://extensions/`
4. 开启右上角的"开发者模式"
5. 点击"加载已解压的扩展程序"
6. 选择本仓库的根目录

## 生成图标

本项目提供了两种生成图标的方式：

### 方法一：使用浏览器生成

1. 在浏览器中打开 `icons/icon_maker.html` 文件
2. 页面会显示四种不同尺寸的图标预览
3. 点击每个图标下方的"下载"按钮，保存对应尺寸的图标
4. 将下载的图标放入 `icons` 目录中，确保文件名分别为：
   - `icon16.png`
   - `icon32.png`
   - `icon48.png`
   - `icon128.png`

### 方法二：使用Node.js脚本生成

如果你安装了Node.js，可以使用提供的脚本自动生成所有图标：

1. 安装依赖：`npm install canvas`
2. 运行脚本：`node generate_icons.js`
3. 脚本会自动在icons目录中创建所有需要的图标文件

或者，你也可以使用自己设计的图标，只需确保按照上述文件名保存到 `icons` 目录即可。

## 使用方法

1. 安装扩展后，在Chrome工具栏中点击GitHub Trending图标
2. 扩展会自动加载并显示当前GitHub上最热门的项目
3. 点击任意项目卡片即可跳转到对应的GitHub仓库页面
4. 点击右上角的刷新按钮可以手动刷新数据

## 技术说明

### 数据获取与解析
- 插件使用 `fetch` API 获取GitHub Trending页面HTML
- 使用正则表达式解析HTML内容，提取需要的项目信息
- 数据会缓存在本地存储中，默认缓存时间为1小时

### 项目结构
- `manifest.json`: 扩展配置文件
- `background.js`: 后台服务工作线程，负责数据获取和解析
- `popup.html`, `popup.css`, `popup.js`: 弹出窗口相关文件
- `icons/`: 图标文件目录
- `generate_icons.js`: Node.js脚本，用于生成图标
- `icons/icon_maker.html`: 浏览器图标生成工具

## 隐私说明

本扩展仅从GitHub公开页面获取数据，不会收集或存储任何用户个人信息。

## 调试与开发

如需调试扩展：
1. 在Chrome扩展管理页面 (`chrome://extensions/`) 找到本扩展
2. 点击"查看视图: 服务工作进程"来查看后台脚本的控制台输出
3. 点击扩展图标打开弹出窗口，然后右键点击->检查，可以查看弹出窗口的控制台输出

## 常见问题

**Q: 扩展无法获取数据怎么办？**  
A: 可能是网络连接问题或GitHub页面结构变化。尝试刷新数据或检查控制台错误信息。

**Q: 数据似乎不是最新的？**  
A: 数据会缓存1小时，点击刷新按钮可强制获取最新数据。

**Q: 为什么需要手动生成图标？**  
A: 浏览器扩展需要多个不同尺寸的图标文件，我们提供了简便的方法来生成这些文件，而不是将它们包含在代码库中。

## 许可证

MIT License