感谢你对本项目的关注！我们欢迎任何形式的贡献。
发现问题？请提交Issue：
- 访问 GitHub Issues
- 点击 "New Issue"
- 选择 "Bug Report" 模板
- 填写以下信息：
- Chrome版本
- 操作系统
- 详细的复现步骤
- 错误截图或控制台日志
- 期望的行为
Bug报告模板：
## Bug描述
简短描述遇到的问题
## 复现步骤
1. 打开...
2. 点击...
3. 看到错误...
## 期望行为
应该发生什么
## 实际行为
实际发生了什么
## 环境信息
- Chrome版本:
- 操作系统:
- 插件版本:
## 截图
如果有的话
## 额外信息
其他相关信息有好的想法？告诉我们：
- 提交 Feature Request Issue
- 或在 Discussions 讨论
功能请求模板：
## 功能描述
简短描述你想要的功能
## 使用场景
为什么需要这个功能？
## 建议的实现方式
如果有的话
## 替代方案
考虑过的其他方案
## 额外信息
其他相关信息想要直接贡献代码？太棒了！
# 1. Fork项目到你的GitHub账号
# 2. Clone到本地
git clone https://github.com/你的用户名/xhs-comment-scraper.git
cd xhs-comment-scraper
# 3. 创建新分支
git checkout -b feature/你的功能名称
# 4. 安装插件到Chrome
# 打开 chrome://extensions/
# 加载 chrome-extension 文件夹JavaScript规范：
- 使用ES6+语法
- 使用4空格缩进
- 变量使用驼峰命名法
- 类名使用大驼峰
- 常量使用大写+下划线
- 添加必要的注释
示例：
// ✅ 好的写法
class DataManager {
constructor() {
this.postInfo = null;
this.comments = [];
}
// 添加评论
addComments(data) {
// 实现逻辑...
}
}
const MAX_RETRY_COUNT = 3;
// ❌ 不好的写法
class datamanager {
constructor() {
this.PostInfo = null;
this.Comments = [];
}
addcomments(data) {
// 没有注释...
}
}CSS规范：
- 使用kebab-case命名
- 添加浏览器前缀（如需要）
- 分组相关属性
示例：
/* ✅ 好的写法 */
.scraper-button {
display: flex;
align-items: center;
padding: 12px 20px;
margin: 10px 0;
background: #007AFF;
border: none;
border-radius: 8px;
transition: all 0.2s;
}
/* ❌ 不好的写法 */
.scraperButton {
display: flex; background: #007AFF; border: none; padding: 12px 20px;
}使用语义化的提交信息：
# 格式
<类型>: <简短描述>
<详细描述>（可选）
<相关Issue>（可选）
# 类型
feat: 新功能
fix: Bug修复
docs: 文档更新
style: 代码格式（不影响功能）
refactor: 重构
perf: 性能优化
test: 测试相关
chore: 构建/工具相关
# 示例
feat: 添加批量导出功能
实现了同时导出多个帖子评论的功能
- 支持选择多个帖子
- 合并导出到单个CSV文件
- 添加进度显示
Closes #123-
确保代码通过测试
# 在Chrome中测试所有功能 - 打开小红书 - 测试抓取功能 - 测试导出功能 - 检查控制台无错误 -
提交代码
git add . git commit -m "feat: 添加你的功能" git push origin feature/你的功能名称
-
创建Pull Request
- 访问你的Fork仓库
- 点击 "New Pull Request"
- 填写PR描述
- 等待审核
PR描述模板：
## 更改内容
简短描述你的更改
## 相关Issue
Closes #issue号
## 更改类型
- [ ] Bug修复
- [ ] 新功能
- [ ] 文档更新
- [ ] 代码重构
- [ ] 性能优化
## 测试
说明如何测试你的更改
## 截图
如果有UI变化，添加截图
## Checklist
- [ ] 代码遵循项目规范
- [ ] 已在Chrome中测试
- [ ] 更新了相关文档
- [ ] 没有引入新的警告文档同样重要！
- 修正错别字
- 改进说明清晰度
- 添加使用示例
- 翻译成其他语言
提交方式同代码PR。
chrome-extension/
├── manifest.json # 插件配置
├── background/
│ └── background.js # 后台服务
├── content/
│ ├── content.js # 页面注入脚本
│ └── content.css # 样式
├── popup/
│ ├── popup.html # 弹窗页面
│ ├── popup.js # 弹窗逻辑
│ └── popup.css # 弹窗样式
└── icons/ # 图标资源
-
DataManager - 数据管理
- 存储帖子、作者、评论信息
- 数据去重
- 格式化处理
-
APIInterceptor - API拦截
- 拦截fetch/XHR请求
- 解析评论数据
- 触发回调
-
UIController - 界面控制
- 创建悬浮窗
- 更新进度
- 绑定事件
-
CSVExporter - 导出功能
- 生成CSV格式
- 下载文件
1. 查看日志
// 控制台输入
xhsScraperDebug()2. 重新加载插件
- chrome://extensions/
- 点击刷新按钮
3. 查看后台日志
- chrome://extensions/
- 点击"检查视图: Service Worker"
4. 调试popup
- 右键点击插件图标
- 选择"检查"
- 简洁优先 - 减少不必要的元素
- Apple风格 - 参照iOS设计规范
- 响应式 - 适配各种屏幕尺寸
- 无障碍 - 考虑可访问性
/* 主色 */
--primary-blue: #007AFF;
--primary-red: #FF2442;
/* 功能色 */
--success-green: #34C759;
--warning-orange: #FF9500;
--error-red: #FF3B30;
/* 中性色 */
--text-dark: #1d1d1f;
--text-light: #86868b;
--bg-white: #ffffff;
--bg-gray: #f5f5f7;font-family: -apple-system, BlinkMacSystemFont,
"SF Pro Text", "Helvetica Neue", sans-serif;
/* 标题 */
font-size: 16px;
font-weight: 600;
/* 正文 */
font-size: 13px;
font-weight: 400;
/* 小字 */
font-size: 11px;
font-weight: 400;在提交PR前，请完成以下测试：
基础功能：
- 插件正常加载
- 悬浮窗正常显示
- 弹窗正常打开
抓取功能：
- 点击"开始抓取"能正常工作
- 评论数实时更新
- 能抓取到子评论
- 自动停止功能正常
导出功能：
- CSV能正常导出
- 文件名正确
- 数据完整
- 中文不乱码
兼容性：
- Chrome最新版本
- Edge最新版本
- 不同操作系统（Windows/Mac/Linux）
边界情况：
- 无评论的帖子
- 大量评论的帖子（1000+）
- 网络较慢时
- 刷新页面后
- 📧 Email: your.email@example.com
- 💬 GitHub Discussions: 参与讨论
- 🐛 GitHub Issues: 提交问题
感谢所有贡献者！
你的贡献会在这里被记录： Contributors
再次感谢你的贡献！ 🎉