feat: Add CI workflows, issue templates, examples, and prompts
This commit is contained in:
tukuaiai
parent
5423dd1fe8
commit
9523f1575d
|
|
@ -1,11 +1,8 @@
|
||||||
|
# .github/ISSUE_TEMPLATE/config.yml
|
||||||
|
# 配置 Issue 模板选择器
|
||||||
|
|
||||||
blank_issues_enabled: true
|
blank_issues_enabled: true
|
||||||
contact_links:
|
contact_links:
|
||||||
- name: 💬 Telegram 交流群
|
- name: 🤔 提问与讨论
|
||||||
url: https://t.me/glue_coding
|
url: https://github.com/tukuaiai/vibe-coding-cn/discussions
|
||||||
about: 加入我们的 Telegram 群组讨论问题
|
about: 请使用 GitHub Discussions 进行提问或发起讨论。
|
||||||
- name: 📢 Telegram 频道
|
|
||||||
url: https://t.me/tradecat_ai_channel
|
|
||||||
about: 关注项目更新和资讯
|
|
||||||
- name: 📖 在线提示词表格
|
|
||||||
url: https://docs.google.com/spreadsheets/d/1ngoQOhJqdguwNAilCl1joNwTje7FWWN9WiI2bo5VhpU/edit?gid=2093180351
|
|
||||||
about: 查看和使用提示词库
|
|
||||||
|
|
@ -1,29 +1,42 @@
|
||||||
---
|
---
|
||||||
name: 文档改进
|
name: "📖 文档改进"
|
||||||
about: 报告文档问题或建议改进
|
description: "提出关于文档的改进建议或报告错误。"
|
||||||
title: "[Docs]: "
|
title: "docs: "
|
||||||
labels: documentation
|
labels: ["documentation"]
|
||||||
assignees: ''
|
body:
|
||||||
|
- type: markdown
|
||||||
|
attributes:
|
||||||
|
value: |
|
||||||
|
感谢您花时间来改进我们的文档！
|
||||||
|
|
||||||
---
|
- type: textarea
|
||||||
|
id: problem-description
|
||||||
|
attributes:
|
||||||
|
label: "您想改进或报告的问题是什么？"
|
||||||
|
description: "请清晰、简洁地描述问题。例如：某个链接失效、某个步骤不清晰、某个概念解释有误等。"
|
||||||
|
validations:
|
||||||
|
required: true
|
||||||
|
|
||||||
**文档位置**
|
- type: textarea
|
||||||
请提供需要改进的文档路径或链接。
|
id: suggested-solution
|
||||||
|
attributes:
|
||||||
|
label: "您的建议方案"
|
||||||
|
description: "您认为应该如何修正？请提供具体的修改建议。"
|
||||||
|
validations:
|
||||||
|
required: true
|
||||||
|
|
||||||
**问题类型**
|
- type: dropdown
|
||||||
- [ ] 内容错误
|
id: document-scope
|
||||||
- [ ] 内容过时
|
attributes:
|
||||||
- [ ] 内容缺失
|
label: "涉及的文档范围"
|
||||||
- [ ] 表述不清
|
description: "这个问题主要影响哪个部分的文档？"
|
||||||
- [ ] 链接失效
|
multiple: true
|
||||||
- [ ] 格式问题
|
options:
|
||||||
- [ ] 翻译问题
|
- "README 主页"
|
||||||
|
- "Wiki"
|
||||||
**问题描述**
|
- "实战案例"
|
||||||
清晰描述文档存在的问题。
|
- "教程与指南"
|
||||||
|
- "方法论与原则"
|
||||||
**建议改进**
|
- "其他"
|
||||||
如果有具体的改进建议，请在此描述。
|
validations:
|
||||||
|
required: true
|
||||||
**附加信息**
|
|
||||||
任何其他相关信息。
|
|
||||||
|
|
@ -1,38 +1,49 @@
|
||||||
---
|
---
|
||||||
name: 提示词贡献
|
name: "💡 贡献新的提示词 (Prompt)"
|
||||||
about: 分享一个有用的提示词
|
description: "分享一个您认为有价值的编程或 AI 相关的提示词。"
|
||||||
title: "[Prompt]: "
|
title: "prompt: "
|
||||||
labels: prompts, contribution
|
labels: ["prompt", "enhancement"]
|
||||||
assignees: ''
|
body:
|
||||||
|
- type: markdown
|
||||||
|
attributes:
|
||||||
|
value: |
|
||||||
|
非常感谢您愿意分享您的宝贵提示词！一个好的提示词能极大地提升我们的工作效率。
|
||||||
|
|
||||||
---
|
- type: input
|
||||||
|
id: prompt-name
|
||||||
|
attributes:
|
||||||
|
label: "提示词名称"
|
||||||
|
description: "给您的提示词起一个简洁明了的名称。"
|
||||||
|
placeholder: "例如：代码调试专家 (Debug Expert)"
|
||||||
|
validations:
|
||||||
|
required: true
|
||||||
|
|
||||||
**提示词名称**
|
- type: textarea
|
||||||
给这个提示词起一个简洁的名字。
|
id: prompt-content
|
||||||
|
attributes:
|
||||||
|
label: "提示词内容"
|
||||||
|
description: "请在此处粘贴您的完整提示词内容。请使用 Markdown 代码块进行格式化。"
|
||||||
|
render: "markdown"
|
||||||
|
validations:
|
||||||
|
required: true
|
||||||
|
|
||||||
**提示词分类**
|
- type: textarea
|
||||||
- [ ] 系统提示词 (system_prompts)
|
id: use-case
|
||||||
- [ ] 编程提示词 (coding_prompts)
|
attributes:
|
||||||
- [ ] 用户提示词 (user_prompts)
|
label: "使用场景和说明"
|
||||||
- [ ] 辅助提示词 (assistant_prompts)
|
description: "请描述这个提示词主要用于解决什么问题？它的效果如何？如果有任何使用的注意事项，也请一并说明。"
|
||||||
- [ ] 元提示词 (meta_prompts)
|
validations:
|
||||||
|
required: true
|
||||||
|
|
||||||
**提示词内容**
|
- type: checkboxes
|
||||||
```
|
id: checklist
|
||||||
在这里粘贴你的提示词内容
|
attributes:
|
||||||
```
|
label: "确认清单"
|
||||||
|
description: "在提交前，请确认以下事项。"
|
||||||
**使用场景**
|
options:
|
||||||
描述这个提示词适用于什么场景。
|
- label: "我确认这个提示词是我原创或有权分享的。"
|
||||||
|
required: true
|
||||||
**效果示例**
|
- label: "我已经在本地测试过这个提示词，并确认其有效性。"
|
||||||
如果可能，提供使用这个提示词的效果示例或截图。
|
required: true
|
||||||
|
- label: "我同意将这个提示词以项目所使用的 [MIT License](LICENSE) 授权给社区。"
|
||||||
**适用模型**
|
required: true
|
||||||
- [ ] Claude
|
|
||||||
- [ ] GPT
|
|
||||||
- [ ] Gemini
|
|
||||||
- [ ] 其他: ___
|
|
||||||
|
|
||||||
**附加说明**
|
|
||||||
任何其他需要说明的内容。
|
|
||||||
|
|
@ -1,45 +1,22 @@
|
||||||
# 文档相关
|
# .github/labeler.yml
|
||||||
|
# 为 actions/labeler 定义标签规则
|
||||||
|
|
||||||
|
# 文档相关的标签
|
||||||
documentation:
|
documentation:
|
||||||
- changed-files:
|
- changed-files:
|
||||||
- any-glob-to-any-file:
|
- any-glob-to-any-file: ['i18n/**/*.md', 'README.md', 'CONTRIBUTING.md', 'LICENSE']
|
||||||
- '**/*.md'
|
|
||||||
- 'docs/**'
|
|
||||||
- 'i18n/**/documents/**'
|
|
||||||
|
|
||||||
# 提示词相关
|
# CI/CD 工作流相关的标签
|
||||||
prompts:
|
cicd:
|
||||||
- changed-files:
|
- changed-files:
|
||||||
- any-glob-to-any-file:
|
- any-glob-to-any-file: '.github/workflows/*'
|
||||||
- 'i18n/**/prompts/**'
|
|
||||||
- 'libs/external/prompts-library/**'
|
|
||||||
|
|
||||||
# 技能相关
|
# 提示词相关的标签
|
||||||
skills:
|
prompt:
|
||||||
- changed-files:
|
- changed-files:
|
||||||
- any-glob-to-any-file:
|
- any-glob-to-any-file: 'i18n/zh/prompts/**/*.md'
|
||||||
- 'i18n/**/skills/**'
|
|
||||||
|
|
||||||
# 工具相关
|
# 实战案例相关的标签
|
||||||
tools:
|
example:
|
||||||
- changed-files:
|
- changed-files:
|
||||||
- any-glob-to-any-file:
|
- any-glob-to-any-file: 'i18n/zh/documents/实战案例/**/*.md'
|
||||||
- 'libs/**'
|
|
||||||
- 'backups/**'
|
|
||||||
|
|
||||||
# 国际化
|
|
||||||
i18n:
|
|
||||||
- changed-files:
|
|
||||||
- any-glob-to-any-file:
|
|
||||||
- 'i18n/**'
|
|
||||||
|
|
||||||
# CI/CD
|
|
||||||
ci:
|
|
||||||
- changed-files:
|
|
||||||
- any-glob-to-any-file:
|
|
||||||
- '.github/**'
|
|
||||||
|
|
||||||
# 中文内容
|
|
||||||
chinese:
|
|
||||||
- changed-files:
|
|
||||||
- any-glob-to-any-file:
|
|
||||||
- 'i18n/zh/**'
|
|
||||||
|
|
@ -1,60 +1,34 @@
|
||||||
|
# .github/workflows/ci.yml
|
||||||
|
# 持续集成工作流：用于代码风格检查和链接检查
|
||||||
|
|
||||||
name: CI
|
name: CI
|
||||||
|
|
||||||
on:
|
on:
|
||||||
push:
|
push:
|
||||||
branches: [main, master]
|
branches: [ main ]
|
||||||
pull_request:
|
pull_request:
|
||||||
branches: [main, master]
|
branches: [ main ]
|
||||||
|
|
||||||
jobs:
|
jobs:
|
||||||
lint-markdown:
|
markdown-lint:
|
||||||
name: Lint Markdown
|
|
||||||
runs-on: ubuntu-latest
|
runs-on: ubuntu-latest
|
||||||
steps:
|
steps:
|
||||||
- uses: actions/checkout@v4
|
- name: Checkout code
|
||||||
|
uses: actions/checkout@v3
|
||||||
- name: Setup Node.js
|
- name: Setup Node.js
|
||||||
uses: actions/setup-node@v4
|
uses: actions/setup-node@v3
|
||||||
with:
|
with:
|
||||||
node-version: '20'
|
node-version: '16'
|
||||||
- name: Install markdownlint-cli
|
- name: Install markdownlint-cli
|
||||||
run: npm install -g markdownlint-cli
|
run: npm install -g markdownlint-cli
|
||||||
- name: Run markdownlint
|
- name: Run markdownlint
|
||||||
run: markdownlint '**/*.md' --ignore node_modules --ignore libs/external || true
|
run: markdownlint --config .github/lint_config.json '**/*.md'
|
||||||
|
|
||||||
check-links:
|
link-checker:
|
||||||
name: Check Links
|
|
||||||
runs-on: ubuntu-latest
|
runs-on: ubuntu-latest
|
||||||
steps:
|
steps:
|
||||||
- uses: actions/checkout@v4
|
- uses: actions/checkout@v3
|
||||||
- name: Link Checker
|
- name: Link Checker
|
||||||
uses: lycheeverse/lychee-action@v1
|
uses: lycheeverse/lychee-action@v1.5.0
|
||||||
with:
|
with:
|
||||||
args: --verbose --no-progress './**/*.md' --exclude-path libs/external
|
args: --verbose --no-progress './**/*.md'
|
||||||
fail: false
|
|
||||||
|
|
||||||
validate-structure:
|
|
||||||
name: Validate Project Structure
|
|
||||||
runs-on: ubuntu-latest
|
|
||||||
steps:
|
|
||||||
- uses: actions/checkout@v4
|
|
||||||
- name: Check required files
|
|
||||||
run: |
|
|
||||||
echo "Checking required files..."
|
|
||||||
files=("README.md" "LICENSE" "CONTRIBUTING.md" "CODE_OF_CONDUCT.md" "AGENTS.md" "CLAUDE.md")
|
|
||||||
for file in "${files[@]}"; do
|
|
||||||
if [ -f "$file" ]; then
|
|
||||||
echo "✓ $file exists"
|
|
||||||
else
|
|
||||||
echo "✗ $file missing"
|
|
||||||
fi
|
|
||||||
done
|
|
||||||
- name: Check i18n structure
|
|
||||||
run: |
|
|
||||||
echo "Checking i18n directories..."
|
|
||||||
for lang in zh en; do
|
|
||||||
if [ -d "i18n/$lang" ]; then
|
|
||||||
echo "✓ i18n/$lang exists"
|
|
||||||
else
|
|
||||||
echo "✗ i18n/$lang missing"
|
|
||||||
fi
|
|
||||||
done
|
|
||||||
|
|
@ -1,16 +1,22 @@
|
||||||
name: Auto Labeler
|
# .github/workflows/labeler.yml
|
||||||
|
# 自动为 Pull Requests 添加标签
|
||||||
|
|
||||||
on:
|
name: Labeler
|
||||||
pull_request:
|
|
||||||
types: [opened, synchronize]
|
on: [pull_request_target]
|
||||||
|
|
||||||
|
permissions:
|
||||||
|
contents: read
|
||||||
|
pull-requests: write
|
||||||
|
|
||||||
jobs:
|
jobs:
|
||||||
label:
|
label:
|
||||||
runs-on: ubuntu-latest
|
runs-on: ubuntu-latest
|
||||||
permissions:
|
|
||||||
contents: read
|
|
||||||
pull-requests: write
|
|
||||||
steps:
|
steps:
|
||||||
- uses: actions/labeler@v5
|
- name: Checkout code
|
||||||
|
uses: actions/checkout@v3
|
||||||
|
- name: Run Labeler
|
||||||
|
uses: actions/labeler@v4
|
||||||
with:
|
with:
|
||||||
repo-token: "${{ secrets.GITHUB_TOKEN }}"
|
repo-token: "${{ secrets.GITHUB_TOKEN }}"
|
||||||
|
configuration-path: .github/labeler.yml
|
||||||
|
|
@ -1,42 +1,30 @@
|
||||||
name: Welcome New Contributors
|
# .github/workflows/welcome.yml
|
||||||
|
# 欢迎新贡献者工作流
|
||||||
|
|
||||||
|
name: Welcome First-Timers
|
||||||
|
|
||||||
on:
|
on:
|
||||||
|
pull_request_target:
|
||||||
|
types: [opened]
|
||||||
issues:
|
issues:
|
||||||
types: [opened]
|
types: [opened]
|
||||||
pull_request:
|
|
||||||
types: [opened]
|
permissions:
|
||||||
|
pull-requests: write
|
||||||
|
issues: write
|
||||||
|
|
||||||
jobs:
|
jobs:
|
||||||
welcome:
|
welcome:
|
||||||
runs-on: ubuntu-latest
|
runs-on: ubuntu-latest
|
||||||
permissions:
|
|
||||||
issues: write
|
|
||||||
pull-requests: write
|
|
||||||
steps:
|
steps:
|
||||||
- uses: actions/first-interaction@v1
|
- name: Welcome new contributor
|
||||||
|
uses: actions/first-interaction@v1
|
||||||
with:
|
with:
|
||||||
repo-token: ${{ secrets.GITHUB_TOKEN }}
|
repo-token: ${{ secrets.GITHUB_TOKEN }}
|
||||||
issue-message: |
|
issue-message: |
|
||||||
👋 感谢您提交第一个 Issue！
|
👋 你好，@${{ github.actor }}！感谢你第一次向 vibe-coding-cn 提交 Issue！
|
||||||
|
我们会尽快查看。欢迎你加入我们的社区！
|
||||||
|
|
||||||
我们非常重视您的反馈。请确保：
|
|
||||||
- 已阅读 [贡献指南](CONTRIBUTING.md)
|
|
||||||
- 提供了足够的上下文信息
|
|
||||||
- 如果是 Bug，请提供复现步骤
|
|
||||||
|
|
||||||
我们会尽快回复您！🚀
|
|
||||||
|
|
||||||
---
|
|
||||||
Thanks for opening your first issue! We'll get back to you soon.
|
|
||||||
pr-message: |
|
pr-message: |
|
||||||
🎉 感谢您提交第一个 Pull Request！
|
👋 你好，@${{ github.actor }}！感谢你第一次向 vibe-coding-cn 提交 Pull Request！
|
||||||
|
我们将仔细评审你的贡献。感谢你让这个项目变得更好！
|
||||||
这是您对本项目的首次贡献，我们非常感激！请确保：
|
|
||||||
- PR 描述清晰说明了改动内容
|
|
||||||
- 代码符合项目规范
|
|
||||||
- 已更新相关文档（如适用）
|
|
||||||
|
|
||||||
我们会尽快审核您的代码！💪
|
|
||||||
|
|
||||||
---
|
|
||||||
Thanks for your first PR! We'll review it soon.
|
|
||||||
|
|
@ -1,209 +1,11 @@
|
||||||
# 实战案例：个人博客系统
|
# 实战案例：从零到一构建博客系统
|
||||||
|
|
||||||
> 难度：⭐⭐ 中等 | 预计时间：2-4 小时 | 技术栈：Next.js + MDX
|
> 本案例将指导您如何使用 Vibe Coding 方法论，与 AI 协作从零开始构建一个功能完善的博客系统。
|
||||||
|
|
||||||
## 🎯 项目目标
|
* **技术栈**: [待定，例如：Next.js, Tailwind CSS, Markdown, Vercel]
|
||||||
|
* **难度**: 中级
|
||||||
|
* **预计用时**: 8-12 小时
|
||||||
|
|
||||||
构建一个支持 Markdown 的个人博客系统，具备：
|
|
||||||
- 文章列表和详情页
|
|
||||||
- 标签分类
|
|
||||||
- 代码高亮
|
|
||||||
- 响应式设计
|
|
||||||
|
|
||||||
## 📋 开始前的准备
|
|
||||||
|
|
||||||
### 环境要求
|
|
||||||
- Node.js 18+
|
|
||||||
- 包管理器（npm/pnpm/yarn）
|
|
||||||
|
|
||||||
### 第一步：需求澄清
|
|
||||||
|
|
||||||
复制以下提示词给 AI：
|
|
||||||
|
|
||||||
```
|
|
||||||
我想用 Vibe Coding 的方式开发一个个人博客系统。
|
|
||||||
|
|
||||||
技术要求：
|
|
||||||
- 框架：Next.js 14 (App Router)
|
|
||||||
- 内容：MDX 格式的 Markdown 文章
|
|
||||||
- 样式：Tailwind CSS
|
|
||||||
- 部署：Vercel
|
|
||||||
|
|
||||||
功能需求：
|
|
||||||
1. 首页显示文章列表（标题、日期、摘要）
|
|
||||||
2. 文章详情页（支持代码高亮）
|
|
||||||
3. 标签页面（按标签筛选文章）
|
|
||||||
4. 关于页面
|
|
||||||
|
|
||||||
请帮我：
|
|
||||||
1. 确认技术栈是否合适
|
|
||||||
2. 生成项目结构
|
|
||||||
3. 一步步指导我完成开发
|
|
||||||
|
|
||||||
要求：每完成一步问我是否成功，再继续下一步。
|
|
||||||
```
|
|
||||||
|
|
||||||
## 🏗️ 项目结构
|
|
||||||
|
|
||||||
```
|
|
||||||
my-blog/
|
|
||||||
├── app/
|
|
||||||
│ ├── layout.tsx # 根布局
|
|
||||||
│ ├── page.tsx # 首页
|
|
||||||
│ ├── posts/
|
|
||||||
│ │ └── [slug]/
|
|
||||||
│ │ └── page.tsx # 文章详情
|
|
||||||
│ ├── tags/
|
|
||||||
│ │ └── [tag]/
|
|
||||||
│ │ └── page.tsx # 标签页
|
|
||||||
│ └── about/
|
|
||||||
│ └── page.tsx # 关于页
|
|
||||||
├── components/
|
|
||||||
│ ├── Header.tsx
|
|
||||||
│ ├── Footer.tsx
|
|
||||||
│ ├── PostCard.tsx
|
|
||||||
│ └── MDXContent.tsx
|
|
||||||
├── content/
|
|
||||||
│ └── posts/ # MDX 文章
|
|
||||||
│ ├── hello-world.mdx
|
|
||||||
│ └── vibe-coding.mdx
|
|
||||||
├── lib/
|
|
||||||
│ └── posts.ts # 文章处理逻辑
|
|
||||||
└── tailwind.config.js
|
|
||||||
```
|
|
||||||
|
|
||||||
## 🔧 核心代码片段
|
|
||||||
|
|
||||||
### 文章处理逻辑 (lib/posts.ts)
|
|
||||||
|
|
||||||
```typescript
|
|
||||||
import fs from 'fs'
|
|
||||||
import path from 'path'
|
|
||||||
import matter from 'gray-matter'
|
|
||||||
|
|
||||||
const postsDirectory = path.join(process.cwd(), 'content/posts')
|
|
||||||
|
|
||||||
export interface Post {
|
|
||||||
slug: string
|
|
||||||
title: string
|
|
||||||
date: string
|
|
||||||
tags: string[]
|
|
||||||
excerpt: string
|
|
||||||
content: string
|
|
||||||
}
|
|
||||||
|
|
||||||
export function getAllPosts(): Post[] {
|
|
||||||
const fileNames = fs.readdirSync(postsDirectory)
|
|
||||||
const posts = fileNames
|
|
||||||
.filter(name => name.endsWith('.mdx'))
|
|
||||||
.map(fileName => {
|
|
||||||
const slug = fileName.replace(/\.mdx$/, '')
|
|
||||||
const fullPath = path.join(postsDirectory, fileName)
|
|
||||||
const fileContents = fs.readFileSync(fullPath, 'utf8')
|
|
||||||
const { data, content } = matter(fileContents)
|
|
||||||
|
|
||||||
return {
|
|
||||||
slug,
|
|
||||||
title: data.title,
|
|
||||||
date: data.date,
|
|
||||||
tags: data.tags || [],
|
|
||||||
excerpt: data.excerpt || content.slice(0, 150),
|
|
||||||
content
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.sort((a, b) => (a.date < b.date ? 1 : -1))
|
|
||||||
|
|
||||||
return posts
|
|
||||||
}
|
|
||||||
|
|
||||||
export function getPostBySlug(slug: string): Post | undefined {
|
|
||||||
return getAllPosts().find(post => post.slug === slug)
|
|
||||||
}
|
|
||||||
```
|
|
||||||
|
|
||||||
### 文章卡片组件 (components/PostCard.tsx)
|
|
||||||
|
|
||||||
```tsx
|
|
||||||
import Link from 'next/link'
|
|
||||||
import { Post } from '@/lib/posts'
|
|
||||||
|
|
||||||
export function PostCard({ post }: { post: Post }) {
|
|
||||||
return (
|
|
||||||
<article className="border-b border-gray-200 py-6">
|
|
||||||
<Link href={`/posts/${post.slug}`}>
|
|
||||||
<h2 className="text-xl font-bold hover:text-blue-600">
|
|
||||||
{post.title}
|
|
||||||
</h2>
|
|
||||||
</Link>
|
|
||||||
<time className="text-sm text-gray-500">{post.date}</time>
|
|
||||||
<p className="mt-2 text-gray-600">{post.excerpt}</p>
|
|
||||||
<div className="mt-2 flex gap-2">
|
|
||||||
{post.tags.map(tag => (
|
|
||||||
<Link
|
|
||||||
key={tag}
|
|
||||||
href={`/tags/${tag}`}
|
|
||||||
className="text-xs bg-gray-100 px-2 py-1 rounded hover:bg-gray-200"
|
|
||||||
>
|
|
||||||
#{tag}
|
|
||||||
</Link>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
</article>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
```
|
|
||||||
|
|
||||||
## 📝 示例文章格式
|
|
||||||
|
|
||||||
```mdx
|
|
||||||
---
|
|
||||||
title: "Hello World"
|
|
||||||
date: "2024-01-01"
|
|
||||||
tags: ["入门", "博客"]
|
|
||||||
excerpt: "这是我的第一篇博客文章"
|
|
||||||
---
|
---
|
||||||
|
|
||||||
# Hello World
|
*(内容待填充...)*
|
||||||
|
|
||||||
欢迎来到我的博客！
|
|
||||||
|
|
||||||
## 代码示例
|
|
||||||
|
|
||||||
```javascript
|
|
||||||
console.log('Hello, Vibe Coding!')
|
|
||||||
```
|
|
||||||
|
|
||||||
## 总结
|
|
||||||
|
|
||||||
这就是我的第一篇文章。
|
|
||||||
```
|
|
||||||
|
|
||||||
## 🚀 部署步骤
|
|
||||||
|
|
||||||
1. 推送代码到 GitHub
|
|
||||||
2. 在 Vercel 导入项目
|
|
||||||
3. 自动部署完成
|
|
||||||
|
|
||||||
## ✅ 验收清单
|
|
||||||
|
|
||||||
- [ ] 首页正确显示文章列表
|
|
||||||
- [ ] 点击文章可以进入详情页
|
|
||||||
- [ ] 代码块有语法高亮
|
|
||||||
- [ ] 标签页面可以筛选文章
|
|
||||||
- [ ] 移动端显示正常
|
|
||||||
- [ ] 部署到 Vercel 成功
|
|
||||||
|
|
||||||
## 🔗 相关资源
|
|
||||||
|
|
||||||
- [Next.js 文档](https://nextjs.org/docs)
|
|
||||||
- [MDX 文档](https://mdxjs.com/)
|
|
||||||
- [Tailwind CSS](https://tailwindcss.com/)
|
|
||||||
|
|
||||||
## 💡 进阶挑战
|
|
||||||
|
|
||||||
完成基础版本后，可以尝试：
|
|
||||||
- 添加搜索功能
|
|
||||||
- 添加评论系统（Giscus）
|
|
||||||
- 添加 RSS 订阅
|
|
||||||
- 添加暗色模式
|
|
||||||
- 添加阅读时间估算
|
|
||||||
|
|
@ -1,298 +1,11 @@
|
||||||
# 实战案例：命令行工具
|
# 实战案例：开发一个高效的命令行工具 (CLI)
|
||||||
|
|
||||||
> 难度：⭐⭐ 中等 | 预计时间：1-2 小时 | 技术栈：Python + Click
|
> 本案例将指导您如何与 AI 协作，构思、设计并实现一个实用的命令行工具，例如一个文件处理器或信息查询工具。
|
||||||
|
|
||||||
## 🎯 项目目标
|
* **技术栈**: [待定，例如：Python (Typer/Click), Go (Cobra)]
|
||||||
|
* **难度**: 初级到中级
|
||||||
|
* **预计用时**: 4-6 小时
|
||||||
|
|
||||||
构建一个实用的命令行工具，实现：
|
---
|
||||||
- 文件批量重命名
|
|
||||||
- 支持多种命名规则
|
|
||||||
- 预览和确认机制
|
|
||||||
- 彩色输出
|
|
||||||
|
|
||||||
## 📋 开始前的准备
|
*(内容待填充...)*
|
||||||
|
|
||||||
### 环境要求
|
|
||||||
- Python 3.8+
|
|
||||||
- pip
|
|
||||||
|
|
||||||
### 第一步：需求澄清
|
|
||||||
|
|
||||||
复制以下提示词给 AI：
|
|
||||||
|
|
||||||
```
|
|
||||||
我想用 Vibe Coding 的方式开发一个文件批量重命名的命令行工具。
|
|
||||||
|
|
||||||
技术要求：
|
|
||||||
- 语言：Python 3.8+
|
|
||||||
- CLI 框架：Click
|
|
||||||
- 输出美化：Rich
|
|
||||||
|
|
||||||
功能需求：
|
|
||||||
1. 支持多种重命名规则：
|
|
||||||
- 添加前缀/后缀
|
|
||||||
- 替换文本
|
|
||||||
- 序号命名
|
|
||||||
- 日期命名
|
|
||||||
2. 预览模式（不实际执行）
|
|
||||||
3. 递归处理子目录（可选）
|
|
||||||
4. 支持文件类型过滤
|
|
||||||
|
|
||||||
请帮我：
|
|
||||||
1. 确认技术栈是否合适
|
|
||||||
2. 生成项目结构
|
|
||||||
3. 一步步指导我完成开发
|
|
||||||
|
|
||||||
要求：每完成一步问我是否成功，再继续下一步。
|
|
||||||
```
|
|
||||||
|
|
||||||
## 🏗️ 项目结构
|
|
||||||
|
|
||||||
```
|
|
||||||
file-renamer/
|
|
||||||
├── renamer/
|
|
||||||
│ ├── __init__.py
|
|
||||||
│ ├── cli.py # CLI 入口
|
|
||||||
│ ├── core.py # 核心逻辑
|
|
||||||
│ └── rules.py # 重命名规则
|
|
||||||
├── tests/
|
|
||||||
│ └── test_core.py
|
|
||||||
├── pyproject.toml
|
|
||||||
└── README.md
|
|
||||||
```
|
|
||||||
|
|
||||||
## 🔧 核心代码
|
|
||||||
|
|
||||||
### CLI 入口 (renamer/cli.py)
|
|
||||||
|
|
||||||
```python
|
|
||||||
import click
|
|
||||||
from rich.console import Console
|
|
||||||
from rich.table import Table
|
|
||||||
from .core import FileRenamer
|
|
||||||
from .rules import PrefixRule, SuffixRule, ReplaceRule, SequenceRule
|
|
||||||
|
|
||||||
console = Console()
|
|
||||||
|
|
||||||
@click.group()
|
|
||||||
@click.version_option(version='1.0.0')
|
|
||||||
def cli():
|
|
||||||
"""文件批量重命名工具"""
|
|
||||||
pass
|
|
||||||
|
|
||||||
@cli.command()
|
|
||||||
@click.argument('directory', type=click.Path(exists=True))
|
|
||||||
@click.option('--prefix', '-p', help='添加前缀')
|
|
||||||
@click.option('--suffix', '-s', help='添加后缀')
|
|
||||||
@click.option('--replace', '-r', nargs=2, help='替换文本 (旧文本 新文本)')
|
|
||||||
@click.option('--sequence', '-n', is_flag=True, help='序号命名')
|
|
||||||
@click.option('--ext', '-e', multiple=True, help='文件扩展名过滤')
|
|
||||||
@click.option('--recursive', '-R', is_flag=True, help='递归处理子目录')
|
|
||||||
@click.option('--dry-run', '-d', is_flag=True, help='预览模式')
|
|
||||||
def rename(directory, prefix, suffix, replace, sequence, ext, recursive, dry_run):
|
|
||||||
"""批量重命名文件"""
|
|
||||||
renamer = FileRenamer(directory, recursive=recursive, extensions=ext)
|
|
||||||
|
|
||||||
# 添加规则
|
|
||||||
if prefix:
|
|
||||||
renamer.add_rule(PrefixRule(prefix))
|
|
||||||
if suffix:
|
|
||||||
renamer.add_rule(SuffixRule(suffix))
|
|
||||||
if replace:
|
|
||||||
renamer.add_rule(ReplaceRule(replace[0], replace[1]))
|
|
||||||
if sequence:
|
|
||||||
renamer.add_rule(SequenceRule())
|
|
||||||
|
|
||||||
if not renamer.rules:
|
|
||||||
console.print("[red]错误：请至少指定一个重命名规则[/red]")
|
|
||||||
return
|
|
||||||
|
|
||||||
# 获取预览
|
|
||||||
changes = renamer.preview()
|
|
||||||
|
|
||||||
if not changes:
|
|
||||||
console.print("[yellow]没有找到匹配的文件[/yellow]")
|
|
||||||
return
|
|
||||||
|
|
||||||
# 显示预览表格
|
|
||||||
table = Table(title="重命名预览")
|
|
||||||
table.add_column("原文件名", style="cyan")
|
|
||||||
table.add_column("新文件名", style="green")
|
|
||||||
|
|
||||||
for old, new in changes:
|
|
||||||
table.add_row(old, new)
|
|
||||||
|
|
||||||
console.print(table)
|
|
||||||
console.print(f"\n共 [bold]{len(changes)}[/bold] 个文件")
|
|
||||||
|
|
||||||
if dry_run:
|
|
||||||
console.print("[yellow]预览模式，未执行实际操作[/yellow]")
|
|
||||||
return
|
|
||||||
|
|
||||||
# 确认执行
|
|
||||||
if click.confirm('确认执行重命名？'):
|
|
||||||
renamer.execute()
|
|
||||||
console.print("[green]✓ 重命名完成！[/green]")
|
|
||||||
else:
|
|
||||||
console.print("[yellow]已取消[/yellow]")
|
|
||||||
|
|
||||||
if __name__ == '__main__':
|
|
||||||
cli()
|
|
||||||
```
|
|
||||||
|
|
||||||
### 核心逻辑 (renamer/core.py)
|
|
||||||
|
|
||||||
```python
|
|
||||||
import os
|
|
||||||
from pathlib import Path
|
|
||||||
from typing import List, Tuple
|
|
||||||
|
|
||||||
class FileRenamer:
|
|
||||||
def __init__(self, directory: str, recursive: bool = False, extensions: tuple = ()):
|
|
||||||
self.directory = Path(directory)
|
|
||||||
self.recursive = recursive
|
|
||||||
self.extensions = extensions
|
|
||||||
self.rules = []
|
|
||||||
|
|
||||||
def add_rule(self, rule):
|
|
||||||
self.rules.append(rule)
|
|
||||||
|
|
||||||
def get_files(self) -> List[Path]:
|
|
||||||
pattern = '**/*' if self.recursive else '*'
|
|
||||||
files = []
|
|
||||||
for path in self.directory.glob(pattern):
|
|
||||||
if path.is_file():
|
|
||||||
if self.extensions:
|
|
||||||
if path.suffix.lower() in [f'.{e.lower()}' for e in self.extensions]:
|
|
||||||
files.append(path)
|
|
||||||
else:
|
|
||||||
files.append(path)
|
|
||||||
return sorted(files)
|
|
||||||
|
|
||||||
def apply_rules(self, filename: str) -> str:
|
|
||||||
result = filename
|
|
||||||
for rule in self.rules:
|
|
||||||
result = rule.apply(result)
|
|
||||||
return result
|
|
||||||
|
|
||||||
def preview(self) -> List[Tuple[str, str]]:
|
|
||||||
changes = []
|
|
||||||
for file in self.get_files():
|
|
||||||
old_name = file.stem
|
|
||||||
new_name = self.apply_rules(old_name)
|
|
||||||
if old_name != new_name:
|
|
||||||
changes.append((file.name, new_name + file.suffix))
|
|
||||||
return changes
|
|
||||||
|
|
||||||
def execute(self):
|
|
||||||
for file in self.get_files():
|
|
||||||
old_name = file.stem
|
|
||||||
new_name = self.apply_rules(old_name)
|
|
||||||
if old_name != new_name:
|
|
||||||
new_path = file.parent / (new_name + file.suffix)
|
|
||||||
file.rename(new_path)
|
|
||||||
```
|
|
||||||
|
|
||||||
### 重命名规则 (renamer/rules.py)
|
|
||||||
|
|
||||||
```python
|
|
||||||
from abc import ABC, abstractmethod
|
|
||||||
|
|
||||||
class Rule(ABC):
|
|
||||||
@abstractmethod
|
|
||||||
def apply(self, filename: str) -> str:
|
|
||||||
pass
|
|
||||||
|
|
||||||
class PrefixRule(Rule):
|
|
||||||
def __init__(self, prefix: str):
|
|
||||||
self.prefix = prefix
|
|
||||||
|
|
||||||
def apply(self, filename: str) -> str:
|
|
||||||
return f"{self.prefix}{filename}"
|
|
||||||
|
|
||||||
class SuffixRule(Rule):
|
|
||||||
def __init__(self, suffix: str):
|
|
||||||
self.suffix = suffix
|
|
||||||
|
|
||||||
def apply(self, filename: str) -> str:
|
|
||||||
return f"{filename}{self.suffix}"
|
|
||||||
|
|
||||||
class ReplaceRule(Rule):
|
|
||||||
def __init__(self, old: str, new: str):
|
|
||||||
self.old = old
|
|
||||||
self.new = new
|
|
||||||
|
|
||||||
def apply(self, filename: str) -> str:
|
|
||||||
return filename.replace(self.old, self.new)
|
|
||||||
|
|
||||||
class SequenceRule(Rule):
|
|
||||||
def __init__(self, start: int = 1, padding: int = 3):
|
|
||||||
self.counter = start
|
|
||||||
self.padding = padding
|
|
||||||
|
|
||||||
def apply(self, filename: str) -> str:
|
|
||||||
result = f"{str(self.counter).zfill(self.padding)}_{filename}"
|
|
||||||
self.counter += 1
|
|
||||||
return result
|
|
||||||
```
|
|
||||||
|
|
||||||
## 📦 安装配置 (pyproject.toml)
|
|
||||||
|
|
||||||
```toml
|
|
||||||
[build-system]
|
|
||||||
requires = ["setuptools>=61.0"]
|
|
||||||
build-backend = "setuptools.build_meta"
|
|
||||||
|
|
||||||
[project]
|
|
||||||
name = "file-renamer"
|
|
||||||
version = "1.0.0"
|
|
||||||
description = "文件批量重命名工具"
|
|
||||||
requires-python = ">=3.8"
|
|
||||||
dependencies = [
|
|
||||||
"click>=8.0",
|
|
||||||
"rich>=13.0",
|
|
||||||
]
|
|
||||||
|
|
||||||
[project.scripts]
|
|
||||||
renamer = "renamer.cli:cli"
|
|
||||||
```
|
|
||||||
|
|
||||||
## 🚀 使用示例
|
|
||||||
|
|
||||||
```bash
|
|
||||||
# 安装
|
|
||||||
pip install -e .
|
|
||||||
|
|
||||||
# 添加前缀
|
|
||||||
renamer rename ./photos --prefix "2024_"
|
|
||||||
|
|
||||||
# 替换文本
|
|
||||||
renamer rename ./docs --replace "old" "new"
|
|
||||||
|
|
||||||
# 序号命名 + 过滤扩展名
|
|
||||||
renamer rename ./images --sequence --ext jpg --ext png
|
|
||||||
|
|
||||||
# 预览模式
|
|
||||||
renamer rename ./files --prefix "backup_" --dry-run
|
|
||||||
|
|
||||||
# 递归处理
|
|
||||||
renamer rename ./project --suffix "_v2" --recursive
|
|
||||||
```
|
|
||||||
|
|
||||||
## ✅ 验收清单
|
|
||||||
|
|
||||||
- [ ] 命令行帮助信息正确显示
|
|
||||||
- [ ] 前缀/后缀功能正常
|
|
||||||
- [ ] 替换功能正常
|
|
||||||
- [ ] 序号命名功能正常
|
|
||||||
- [ ] 预览模式不执行实际操作
|
|
||||||
- [ ] 扩展名过滤正常
|
|
||||||
- [ ] 递归处理正常
|
|
||||||
|
|
||||||
## 💡 进阶挑战
|
|
||||||
|
|
||||||
- 添加撤销功能（记录操作日志）
|
|
||||||
- 支持正则表达式
|
|
||||||
- 添加日期格式化规则
|
|
||||||
- 支持配置文件
|
|
||||||
- 添加交互式模式
|
|
||||||
|
|
@ -1,402 +1,11 @@
|
||||||
# 实战案例：Chrome 扩展
|
# 实战案例：制作一个浏览器扩展程序
|
||||||
|
|
||||||
> 难度：⭐⭐ 中等 | 预计时间：2-3 小时 | 技术栈：JavaScript + Chrome API
|
> 本案例将指导您如何与 AI 协作，开发一个简单的 Chrome 浏览器扩展，例如页面截图、内容聚合或自定义脚本注入工具。
|
||||||
|
|
||||||
## 🎯 项目目标
|
* **技术栈**: [JavaScript, HTML, CSS, Manifest V3]
|
||||||
|
* **难度**: 中级
|
||||||
|
* **预计用时**: 6-10 小时
|
||||||
|
|
||||||
构建一个实用的 Chrome 扩展 - **网页笔记助手**：
|
---
|
||||||
- 选中文本快速保存
|
|
||||||
- 自动记录来源 URL
|
|
||||||
- 本地存储笔记
|
|
||||||
- 导出功能
|
|
||||||
|
|
||||||
## 📋 开始前的准备
|
*(内容待填充...)*
|
||||||
|
|
||||||
### 环境要求
|
|
||||||
- Chrome 浏览器
|
|
||||||
- 代码编辑器
|
|
||||||
|
|
||||||
### 第一步：需求澄清
|
|
||||||
|
|
||||||
复制以下提示词给 AI：
|
|
||||||
|
|
||||||
```
|
|
||||||
我想用 Vibe Coding 的方式开发一个 Chrome 扩展 - 网页笔记助手。
|
|
||||||
|
|
||||||
技术要求：
|
|
||||||
- Manifest V3
|
|
||||||
- 纯 JavaScript（不用框架）
|
|
||||||
- Chrome Storage API
|
|
||||||
|
|
||||||
功能需求：
|
|
||||||
1. 右键菜单：选中文本后右键保存
|
|
||||||
2. 弹出窗口：显示所有笔记
|
|
||||||
3. 自动记录：来源 URL、保存时间
|
|
||||||
4. 导出功能：导出为 JSON/Markdown
|
|
||||||
|
|
||||||
请帮我：
|
|
||||||
1. 确认技术方案
|
|
||||||
2. 生成项目结构
|
|
||||||
3. 一步步指导我完成开发
|
|
||||||
|
|
||||||
要求：每完成一步问我是否成功，再继续下一步。
|
|
||||||
```
|
|
||||||
|
|
||||||
## 🏗️ 项目结构
|
|
||||||
|
|
||||||
```
|
|
||||||
web-notes/
|
|
||||||
├── manifest.json # 扩展配置
|
|
||||||
├── background.js # 后台脚本
|
|
||||||
├── popup/
|
|
||||||
│ ├── popup.html # 弹出窗口
|
|
||||||
│ ├── popup.css
|
|
||||||
│ └── popup.js
|
|
||||||
├── icons/
|
|
||||||
│ ├── icon16.png
|
|
||||||
│ ├── icon48.png
|
|
||||||
│ └── icon128.png
|
|
||||||
└── README.md
|
|
||||||
```
|
|
||||||
|
|
||||||
## 🔧 核心代码
|
|
||||||
|
|
||||||
### 扩展配置 (manifest.json)
|
|
||||||
|
|
||||||
```json
|
|
||||||
{
|
|
||||||
"manifest_version": 3,
|
|
||||||
"name": "网页笔记助手",
|
|
||||||
"version": "1.0.0",
|
|
||||||
"description": "快速保存网页内容到本地笔记",
|
|
||||||
"permissions": [
|
|
||||||
"storage",
|
|
||||||
"contextMenus",
|
|
||||||
"activeTab"
|
|
||||||
],
|
|
||||||
"background": {
|
|
||||||
"service_worker": "background.js"
|
|
||||||
},
|
|
||||||
"action": {
|
|
||||||
"default_popup": "popup/popup.html",
|
|
||||||
"default_icon": {
|
|
||||||
"16": "icons/icon16.png",
|
|
||||||
"48": "icons/icon48.png",
|
|
||||||
"128": "icons/icon128.png"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"icons": {
|
|
||||||
"16": "icons/icon16.png",
|
|
||||||
"48": "icons/icon48.png",
|
|
||||||
"128": "icons/icon128.png"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
```
|
|
||||||
|
|
||||||
### 后台脚本 (background.js)
|
|
||||||
|
|
||||||
```javascript
|
|
||||||
// 创建右键菜单
|
|
||||||
chrome.runtime.onInstalled.addListener(() => {
|
|
||||||
chrome.contextMenus.create({
|
|
||||||
id: 'saveNote',
|
|
||||||
title: '保存到笔记',
|
|
||||||
contexts: ['selection']
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
// 处理右键菜单点击
|
|
||||||
chrome.contextMenus.onClicked.addListener(async (info, tab) => {
|
|
||||||
if (info.menuItemId === 'saveNote' && info.selectionText) {
|
|
||||||
const note = {
|
|
||||||
id: Date.now().toString(),
|
|
||||||
text: info.selectionText,
|
|
||||||
url: tab.url,
|
|
||||||
title: tab.title,
|
|
||||||
createdAt: new Date().toISOString()
|
|
||||||
};
|
|
||||||
|
|
||||||
// 获取现有笔记
|
|
||||||
const { notes = [] } = await chrome.storage.local.get('notes');
|
|
||||||
|
|
||||||
// 添加新笔记
|
|
||||||
notes.unshift(note);
|
|
||||||
|
|
||||||
// 保存
|
|
||||||
await chrome.storage.local.set({ notes });
|
|
||||||
|
|
||||||
// 显示通知（可选）
|
|
||||||
console.log('笔记已保存:', note.text.slice(0, 50));
|
|
||||||
}
|
|
||||||
});
|
|
||||||
```
|
|
||||||
|
|
||||||
### 弹出窗口 HTML (popup/popup.html)
|
|
||||||
|
|
||||||
```html
|
|
||||||
<!DOCTYPE html>
|
|
||||||
<html>
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<link rel="stylesheet" href="popup.css">
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<div class="container">
|
|
||||||
<header>
|
|
||||||
<h1>📝 我的笔记</h1>
|
|
||||||
<div class="actions">
|
|
||||||
<button id="exportJson">导出 JSON</button>
|
|
||||||
<button id="exportMd">导出 MD</button>
|
|
||||||
<button id="clearAll">清空</button>
|
|
||||||
</div>
|
|
||||||
</header>
|
|
||||||
|
|
||||||
<div class="search">
|
|
||||||
<input type="text" id="searchInput" placeholder="搜索笔记...">
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="notesList" class="notes-list">
|
|
||||||
<!-- 笔记列表 -->
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<footer>
|
|
||||||
<span id="noteCount">0 条笔记</span>
|
|
||||||
</footer>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<script src="popup.js"></script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
```
|
|
||||||
|
|
||||||
### 弹出窗口样式 (popup/popup.css)
|
|
||||||
|
|
||||||
```css
|
|
||||||
* {
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
box-sizing: border-box;
|
|
||||||
}
|
|
||||||
|
|
||||||
body {
|
|
||||||
width: 400px;
|
|
||||||
max-height: 500px;
|
|
||||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
|
||||||
}
|
|
||||||
|
|
||||||
.container {
|
|
||||||
padding: 16px;
|
|
||||||
}
|
|
||||||
|
|
||||||
header {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
margin-bottom: 12px;
|
|
||||||
}
|
|
||||||
|
|
||||||
header h1 {
|
|
||||||
font-size: 18px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.actions button {
|
|
||||||
padding: 4px 8px;
|
|
||||||
margin-left: 4px;
|
|
||||||
font-size: 12px;
|
|
||||||
cursor: pointer;
|
|
||||||
border: 1px solid #ddd;
|
|
||||||
border-radius: 4px;
|
|
||||||
background: #fff;
|
|
||||||
}
|
|
||||||
|
|
||||||
.actions button:hover {
|
|
||||||
background: #f5f5f5;
|
|
||||||
}
|
|
||||||
|
|
||||||
.search input {
|
|
||||||
width: 100%;
|
|
||||||
padding: 8px 12px;
|
|
||||||
border: 1px solid #ddd;
|
|
||||||
border-radius: 4px;
|
|
||||||
margin-bottom: 12px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.notes-list {
|
|
||||||
max-height: 350px;
|
|
||||||
overflow-y: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.note-item {
|
|
||||||
padding: 12px;
|
|
||||||
border: 1px solid #eee;
|
|
||||||
border-radius: 8px;
|
|
||||||
margin-bottom: 8px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.note-text {
|
|
||||||
font-size: 14px;
|
|
||||||
line-height: 1.5;
|
|
||||||
margin-bottom: 8px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.note-meta {
|
|
||||||
font-size: 12px;
|
|
||||||
color: #666;
|
|
||||||
}
|
|
||||||
|
|
||||||
.note-meta a {
|
|
||||||
color: #0066cc;
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.note-delete {
|
|
||||||
float: right;
|
|
||||||
cursor: pointer;
|
|
||||||
color: #999;
|
|
||||||
}
|
|
||||||
|
|
||||||
.note-delete:hover {
|
|
||||||
color: #ff4444;
|
|
||||||
}
|
|
||||||
|
|
||||||
footer {
|
|
||||||
margin-top: 12px;
|
|
||||||
text-align: center;
|
|
||||||
color: #666;
|
|
||||||
font-size: 12px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.empty {
|
|
||||||
text-align: center;
|
|
||||||
color: #999;
|
|
||||||
padding: 40px;
|
|
||||||
}
|
|
||||||
```
|
|
||||||
|
|
||||||
### 弹出窗口逻辑 (popup/popup.js)
|
|
||||||
|
|
||||||
```javascript
|
|
||||||
let allNotes = [];
|
|
||||||
|
|
||||||
// 加载笔记
|
|
||||||
async function loadNotes() {
|
|
||||||
const { notes = [] } = await chrome.storage.local.get('notes');
|
|
||||||
allNotes = notes;
|
|
||||||
renderNotes(notes);
|
|
||||||
}
|
|
||||||
|
|
||||||
// 渲染笔记列表
|
|
||||||
function renderNotes(notes) {
|
|
||||||
const container = document.getElementById('notesList');
|
|
||||||
const countEl = document.getElementById('noteCount');
|
|
||||||
|
|
||||||
countEl.textContent = `${notes.length} 条笔记`;
|
|
||||||
|
|
||||||
if (notes.length === 0) {
|
|
||||||
container.innerHTML = '<div class="empty">暂无笔记<br>选中网页文字后右键保存</div>';
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
container.innerHTML = notes.map(note => `
|
|
||||||
<div class="note-item" data-id="${note.id}">
|
|
||||||
<span class="note-delete" onclick="deleteNote('${note.id}')">✕</span>
|
|
||||||
<div class="note-text">${escapeHtml(note.text)}</div>
|
|
||||||
<div class="note-meta">
|
|
||||||
<a href="${note.url}" target="_blank">${note.title || '未知页面'}</a>
|
|
||||||
<br>
|
|
||||||
${formatDate(note.createdAt)}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
`).join('');
|
|
||||||
}
|
|
||||||
|
|
||||||
// 删除笔记
|
|
||||||
async function deleteNote(id) {
|
|
||||||
allNotes = allNotes.filter(n => n.id !== id);
|
|
||||||
await chrome.storage.local.set({ notes: allNotes });
|
|
||||||
renderNotes(allNotes);
|
|
||||||
}
|
|
||||||
|
|
||||||
// 搜索
|
|
||||||
document.getElementById('searchInput').addEventListener('input', (e) => {
|
|
||||||
const query = e.target.value.toLowerCase();
|
|
||||||
const filtered = allNotes.filter(note =>
|
|
||||||
note.text.toLowerCase().includes(query) ||
|
|
||||||
(note.title && note.title.toLowerCase().includes(query))
|
|
||||||
);
|
|
||||||
renderNotes(filtered);
|
|
||||||
});
|
|
||||||
|
|
||||||
// 导出 JSON
|
|
||||||
document.getElementById('exportJson').addEventListener('click', () => {
|
|
||||||
const blob = new Blob([JSON.stringify(allNotes, null, 2)], { type: 'application/json' });
|
|
||||||
downloadBlob(blob, 'notes.json');
|
|
||||||
});
|
|
||||||
|
|
||||||
// 导出 Markdown
|
|
||||||
document.getElementById('exportMd').addEventListener('click', () => {
|
|
||||||
const md = allNotes.map(note =>
|
|
||||||
`## ${formatDate(note.createdAt)}\n\n${note.text}\n\n> 来源: [${note.title}](${note.url})\n`
|
|
||||||
).join('\n---\n\n');
|
|
||||||
const blob = new Blob([md], { type: 'text/markdown' });
|
|
||||||
downloadBlob(blob, 'notes.md');
|
|
||||||
});
|
|
||||||
|
|
||||||
// 清空
|
|
||||||
document.getElementById('clearAll').addEventListener('click', async () => {
|
|
||||||
if (confirm('确定清空所有笔记？')) {
|
|
||||||
allNotes = [];
|
|
||||||
await chrome.storage.local.set({ notes: [] });
|
|
||||||
renderNotes([]);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
// 工具函数
|
|
||||||
function escapeHtml(text) {
|
|
||||||
const div = document.createElement('div');
|
|
||||||
div.textContent = text;
|
|
||||||
return div.innerHTML;
|
|
||||||
}
|
|
||||||
|
|
||||||
function formatDate(isoString) {
|
|
||||||
return new Date(isoString).toLocaleString('zh-CN');
|
|
||||||
}
|
|
||||||
|
|
||||||
function downloadBlob(blob, filename) {
|
|
||||||
const url = URL.createObjectURL(blob);
|
|
||||||
const a = document.createElement('a');
|
|
||||||
a.href = url;
|
|
||||||
a.download = filename;
|
|
||||||
a.click();
|
|
||||||
URL.revokeObjectURL(url);
|
|
||||||
}
|
|
||||||
|
|
||||||
// 初始化
|
|
||||||
loadNotes();
|
|
||||||
```
|
|
||||||
|
|
||||||
## 🚀 安装步骤
|
|
||||||
|
|
||||||
1. 打开 Chrome，访问 `chrome://extensions/`
|
|
||||||
2. 开启「开发者模式」
|
|
||||||
3. 点击「加载已解压的扩展程序」
|
|
||||||
4. 选择项目文件夹
|
|
||||||
|
|
||||||
## ✅ 验收清单
|
|
||||||
|
|
||||||
- [ ] 扩展成功加载
|
|
||||||
- [ ] 右键菜单显示「保存到笔记」
|
|
||||||
- [ ] 选中文本可以保存
|
|
||||||
- [ ] 弹出窗口显示笔记列表
|
|
||||||
- [ ] 搜索功能正常
|
|
||||||
- [ ] 删除功能正常
|
|
||||||
- [ ] 导出 JSON 正常
|
|
||||||
- [ ] 导出 Markdown 正常
|
|
||||||
|
|
||||||
## 💡 进阶挑战
|
|
||||||
|
|
||||||
- 添加标签分类
|
|
||||||
- 支持云同步（Chrome Sync）
|
|
||||||
- 添加快捷键
|
|
||||||
- 支持图片保存
|
|
||||||
- 添加笔记编辑功能
|
|
||||||
|
|
@ -1,299 +1,32 @@
|
||||||
# 架构设计提示词
|
# 提示词：首席软件架构师
|
||||||
|
|
||||||
> 让 AI 帮你设计清晰、可扩展的系统架构
|
> 用于进行高层次的系统设计、技术选型和架构决策。
|
||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
## 🏗️ 项目架构设计
|
|
||||||
|
|
||||||
```
|
```
|
||||||
我要开发一个 [项目类型]，请帮我设计系统架构。
|
# Role: 首席软件架构师 (Principal Software Architect)
|
||||||
|
|
||||||
## 项目背景
|
## Profile:
|
||||||
[简要描述项目目的和背景]
|
- **author:** aiai
|
||||||
|
- **version:** 0.1
|
||||||
|
- **language:** Chinese
|
||||||
|
- **description:** 我是一名顶级的软件架构师，专注于构建高性能、高可用、可扩展且易于维护的复杂系统。我擅长领域驱动设计（DDD）、微服务架构、云原生技术以及在模糊的需求中识别核心问题。
|
||||||
|
|
||||||
## 功能需求
|
## Rules:
|
||||||
1. [核心功能 1]
|
1. **第一性原理思考**: 我会深入探究需求的本质，而不是停留在表面。
|
||||||
2. [核心功能 2]
|
2. **权衡利弊**: 我提出的任何方案都会明确指出其优点、缺点以及需要做出的权衡（Trade-offs）。
|
||||||
3. [核心功能 3]
|
3. **技术无关性**: 在初期，我会专注于业务逻辑和架构模式，而非具体的技术实现，除非用户明确要求。
|
||||||
|
4. **图表辅助**: 在适当的时候，我会使用 Mermaid.js 语法生成架构图（如 C4 模型、流程图）来可视化我的设计。
|
||||||
|
5. **主动提问**: 如果需求不明确，我会提出关键问题来澄清。
|
||||||
|
|
||||||
## 非功能需求
|
## Workflow:
|
||||||
- 预期用户量：[X 人]
|
1. **需求分析 (Requirement Analysis)**: 我会首先要求用户提供明确的业务需求、目标、约束（如预算、团队技能）和预期负载。
|
||||||
- 并发要求：[X QPS]
|
2. **领域建模 (Domain Modeling)**: 我会识别核心领域、子域、限界上下文（Bounded Context）和它们之间的关系。
|
||||||
- 数据量级：[X 条/GB]
|
3. **架构设计 (Architecture Design)**: 我会提出一个或多个候选架构方案（如单体、微服务、事件驱动），并进行比较。
|
||||||
- 可用性要求：[99.9%]
|
4. **技术选型 (Technology Stack)**: 在确定架构后，我会建议合适的技术栈（语言、框架、数据库、消息队列等）。
|
||||||
|
5. **细化方案 (Refinement)**: 我会阐述关键模块的职责、接口设计以及数据流。
|
||||||
|
|
||||||
## 技术偏好（可选）
|
## Init:
|
||||||
- 语言：[如 Python/Go/Node.js]
|
请向我描述您要构建的系统或要解决的问题。
|
||||||
- 部署环境：[如 云服务器/Serverless/K8s]
|
|
||||||
|
|
||||||
请提供：
|
|
||||||
1. 整体架构图（用 Mermaid 或 ASCII）
|
|
||||||
2. 技术栈选型及理由
|
|
||||||
3. 核心模块划分
|
|
||||||
4. 数据流设计
|
|
||||||
5. 关键设计决策说明
|
|
||||||
```
|
```
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 📊 数据库设计
|
|
||||||
|
|
||||||
```
|
|
||||||
请帮我设计数据库结构：
|
|
||||||
|
|
||||||
## 业务场景
|
|
||||||
[描述业务场景]
|
|
||||||
|
|
||||||
## 核心实体
|
|
||||||
1. [实体 1]：[描述]
|
|
||||||
2. [实体 2]：[描述]
|
|
||||||
3. [实体 3]：[描述]
|
|
||||||
|
|
||||||
## 主要操作
|
|
||||||
- [操作 1]：[频率]
|
|
||||||
- [操作 2]：[频率]
|
|
||||||
|
|
||||||
## 约束条件
|
|
||||||
- 数据库类型：[MySQL/PostgreSQL/MongoDB]
|
|
||||||
- 数据量预估：[X 条]
|
|
||||||
|
|
||||||
请提供：
|
|
||||||
1. ER 图（Mermaid 格式）
|
|
||||||
2. 建表 SQL
|
|
||||||
3. 索引设计
|
|
||||||
4. 关键查询示例
|
|
||||||
```
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 🔌 API 设计
|
|
||||||
|
|
||||||
```
|
|
||||||
请帮我设计 RESTful API：
|
|
||||||
|
|
||||||
## 资源描述
|
|
||||||
[描述要管理的资源]
|
|
||||||
|
|
||||||
## 功能需求
|
|
||||||
1. [功能 1]
|
|
||||||
2. [功能 2]
|
|
||||||
3. [功能 3]
|
|
||||||
|
|
||||||
## 用户角色
|
|
||||||
- [角色 1]：[权限描述]
|
|
||||||
- [角色 2]：[权限描述]
|
|
||||||
|
|
||||||
请提供：
|
|
||||||
1. API 端点列表（方法、路径、描述）
|
|
||||||
2. 请求/响应示例（JSON 格式）
|
|
||||||
3. 错误码设计
|
|
||||||
4. 认证方案
|
|
||||||
5. 版本控制策略
|
|
||||||
```
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 🧩 模块划分
|
|
||||||
|
|
||||||
```
|
|
||||||
请帮我进行模块划分：
|
|
||||||
|
|
||||||
## 项目描述
|
|
||||||
[描述项目]
|
|
||||||
|
|
||||||
## 当前代码结构
|
|
||||||
```
|
|
||||||
[粘贴目录结构或描述]
|
|
||||||
```
|
|
||||||
|
|
||||||
## 问题
|
|
||||||
[描述当前架构的问题，如：耦合严重/职责不清]
|
|
||||||
|
|
||||||
请：
|
|
||||||
1. 分析当前架构问题
|
|
||||||
2. 提出模块划分方案
|
|
||||||
3. 定义模块间接口
|
|
||||||
4. 给出重构路径
|
|
||||||
```
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 🔄 微服务拆分
|
|
||||||
|
|
||||||
```
|
|
||||||
我想将单体应用拆分为微服务：
|
|
||||||
|
|
||||||
## 当前系统
|
|
||||||
[描述当前单体应用]
|
|
||||||
|
|
||||||
## 业务模块
|
|
||||||
1. [模块 1]：[描述]
|
|
||||||
2. [模块 2]：[描述]
|
|
||||||
3. [模块 3]：[描述]
|
|
||||||
|
|
||||||
## 拆分动机
|
|
||||||
[为什么要拆分]
|
|
||||||
|
|
||||||
## 约束条件
|
|
||||||
- 团队规模：[X 人]
|
|
||||||
- 技术栈：[当前技术栈]
|
|
||||||
- 时间预算：[X 个月]
|
|
||||||
|
|
||||||
请提供：
|
|
||||||
1. 服务划分方案
|
|
||||||
2. 服务间通信设计
|
|
||||||
3. 数据一致性方案
|
|
||||||
4. 部署架构
|
|
||||||
5. 渐进式迁移计划
|
|
||||||
```
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 📈 扩展性设计
|
|
||||||
|
|
||||||
```
|
|
||||||
请帮我设计一个可扩展的系统：
|
|
||||||
|
|
||||||
## 当前规模
|
|
||||||
- 用户量：[X]
|
|
||||||
- 数据量：[X]
|
|
||||||
- QPS：[X]
|
|
||||||
|
|
||||||
## 目标规模
|
|
||||||
- 用户量：[X]
|
|
||||||
- 数据量：[X]
|
|
||||||
- QPS：[X]
|
|
||||||
|
|
||||||
## 当前架构
|
|
||||||
[描述或图示]
|
|
||||||
|
|
||||||
请提供：
|
|
||||||
1. 扩展瓶颈分析
|
|
||||||
2. 水平扩展方案
|
|
||||||
3. 缓存策略
|
|
||||||
4. 数据库扩展方案
|
|
||||||
5. 成本估算
|
|
||||||
```
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 🔐 安全架构
|
|
||||||
|
|
||||||
```
|
|
||||||
请帮我设计安全架构：
|
|
||||||
|
|
||||||
## 系统描述
|
|
||||||
[描述系统]
|
|
||||||
|
|
||||||
## 敏感数据
|
|
||||||
- [数据类型 1]
|
|
||||||
- [数据类型 2]
|
|
||||||
|
|
||||||
## 合规要求
|
|
||||||
- [如 GDPR/等保]
|
|
||||||
|
|
||||||
请提供：
|
|
||||||
1. 认证方案
|
|
||||||
2. 授权模型
|
|
||||||
3. 数据加密策略
|
|
||||||
4. 审计日志设计
|
|
||||||
5. 安全最佳实践清单
|
|
||||||
```
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 📝 技术方案文档
|
|
||||||
|
|
||||||
```
|
|
||||||
请帮我撰写技术方案文档：
|
|
||||||
|
|
||||||
## 需求背景
|
|
||||||
[描述需求]
|
|
||||||
|
|
||||||
## 目标
|
|
||||||
[描述目标]
|
|
||||||
|
|
||||||
请按以下结构输出：
|
|
||||||
|
|
||||||
# 技术方案：[标题]
|
|
||||||
|
|
||||||
## 1. 背景与目标
|
|
||||||
## 2. 方案概述
|
|
||||||
## 3. 详细设计
|
|
||||||
### 3.1 架构设计
|
|
||||||
### 3.2 数据设计
|
|
||||||
### 3.3 接口设计
|
|
||||||
## 4. 技术选型
|
|
||||||
## 5. 风险评估
|
|
||||||
## 6. 里程碑计划
|
|
||||||
## 7. 附录
|
|
||||||
```
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 🎨 架构图模板
|
|
||||||
|
|
||||||
### 系统架构图
|
|
||||||
|
|
||||||
```
|
|
||||||
请用 Mermaid 画出系统架构图：
|
|
||||||
|
|
||||||
系统包含：
|
|
||||||
- [组件 1]
|
|
||||||
- [组件 2]
|
|
||||||
- [组件 3]
|
|
||||||
|
|
||||||
关系：
|
|
||||||
- [组件 1] 调用 [组件 2]
|
|
||||||
- [组件 2] 读写 [数据库]
|
|
||||||
```
|
|
||||||
|
|
||||||
### 时序图
|
|
||||||
|
|
||||||
```
|
|
||||||
请用 Mermaid 画出以下流程的时序图：
|
|
||||||
|
|
||||||
参与者：
|
|
||||||
- 用户
|
|
||||||
- 前端
|
|
||||||
- 后端
|
|
||||||
- 数据库
|
|
||||||
|
|
||||||
流程：
|
|
||||||
1. [步骤 1]
|
|
||||||
2. [步骤 2]
|
|
||||||
3. [步骤 3]
|
|
||||||
```
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 💡 设计原则提醒
|
|
||||||
|
|
||||||
```
|
|
||||||
请检查我的架构设计是否符合以下原则：
|
|
||||||
|
|
||||||
架构描述：
|
|
||||||
[描述你的架构]
|
|
||||||
|
|
||||||
检查项：
|
|
||||||
- [ ] 单一职责原则
|
|
||||||
- [ ] 开闭原则
|
|
||||||
- [ ] 依赖倒置原则
|
|
||||||
- [ ] 高内聚低耦合
|
|
||||||
- [ ] 关注点分离
|
|
||||||
- [ ] 可测试性
|
|
||||||
- [ ] 可观测性
|
|
||||||
|
|
||||||
请指出不符合的地方并给出改进建议。
|
|
||||||
```
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 使用建议
|
|
||||||
|
|
||||||
1. **先明确需求** - 架构服务于需求，需求不清架构必乱
|
|
||||||
2. **考虑约束** - 团队规模、时间、预算都是约束
|
|
||||||
3. **渐进式设计** - 不要过度设计，够用就好
|
|
||||||
4. **画图辅助** - 让 AI 用 Mermaid 画图更直观
|
|
||||||
5. **迭代优化** - 架构不是一次性的，持续演进
|
|
||||||
|
|
|
||||||
|
|
@ -1,272 +1,32 @@
|
||||||
# 代码审查提示词
|
# 提示词：资深代码审查员 (Senior Code Reviewer)
|
||||||
|
|
||||||
> 让 AI 帮你进行专业的代码审查
|
> 用于对代码片段、Pull Request 进行深入、细致且富有建设性的审查。
|
||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
## 🔍 通用代码审查
|
|
||||||
|
|
||||||
```
|
```
|
||||||
请对以下代码进行全面的代码审查：
|
# Role: 资深代码审查员 (Senior Code Reviewer)
|
||||||
|
|
||||||
|
## Profile:
|
||||||
|
- **author:** aiai
|
||||||
|
- **version:** 0.1
|
||||||
|
- **language:** Chinese
|
||||||
|
- **description:** 我是一名经验丰富的代码审查员，拥有超过15年的多种语言（如 Python, Go, TypeScript, Rust）开发经验。我不仅关注代码是否能工作，更关注其可读性、可维护性、健壮性和安全性。我的评审意见总是具体、有建设性且带有积极的口吻。
|
||||||
|
|
||||||
|
## Rules:
|
||||||
|
1. **分点阐述**: 我的审查意见会按类别（如“设计”、“健壮性”、“命名”、“风格”）分点列出。
|
||||||
|
2. **提供示例**: 对于修改建议，我会尽量提供“之前”和“之后”的代码示例。
|
||||||
|
3. **解释原因**: 我会解释“为什么”要这样修改，而不仅仅是“怎么改”。我会引用通用的设计原则（如 SOLID, DRY）或特定的语言规范。
|
||||||
|
4. **提出问题**: 对于不确定的地方，我会以提问的方式引导作者思考，而不是直接下定论。
|
||||||
|
5. **赞扬优点**: 我会首先发现并赞扬代码中的优点，然后再提出改进建议。
|
||||||
|
|
||||||
|
## Workflow:
|
||||||
|
1. **整体理解 (High-Level Understanding)**: 我会先快速阅读代码，理解其核心功能和目的。
|
||||||
|
2. **设计与架构 (Design & Architecture)**: 我会评估代码的整体结构是否合理，是否遵循了项目既定的架构模式。
|
||||||
|
3. **逐行审查 (Line-by-Line Review)**: 我会仔细检查每一行代码的逻辑、命名、错误处理和边界情况。
|
||||||
|
4. **总结意见 (Summarize Feedback)**: 我会将所有发现汇总成一份清晰、结构化的审查报告。
|
||||||
|
5. **确定优先级**: 我会用 [Critical], [Major], [Minor] 等标签标明每个修改建议的严重程度。
|
||||||
|
|
||||||
|
## Init:
|
||||||
|
请提供您需要我审查的代码。您可以直接粘贴代码，或者提供一个指向 Pull Request 的链接。
|
||||||
```
|
```
|
||||||
[粘贴代码]
|
|
||||||
```
|
|
||||||
|
|
||||||
请从以下维度进行审查：
|
|
||||||
|
|
||||||
1. **代码质量**
|
|
||||||
- 可读性
|
|
||||||
- 命名规范
|
|
||||||
- 代码结构
|
|
||||||
|
|
||||||
2. **潜在问题**
|
|
||||||
- Bug 风险
|
|
||||||
- 边界情况
|
|
||||||
- 异常处理
|
|
||||||
|
|
||||||
3. **性能**
|
|
||||||
- 时间复杂度
|
|
||||||
- 空间复杂度
|
|
||||||
- 优化建议
|
|
||||||
|
|
||||||
4. **安全性**
|
|
||||||
- 输入验证
|
|
||||||
- 敏感数据处理
|
|
||||||
- 常见漏洞
|
|
||||||
|
|
||||||
5. **最佳实践**
|
|
||||||
- 设计模式
|
|
||||||
- SOLID 原则
|
|
||||||
- 语言特性使用
|
|
||||||
|
|
||||||
请按严重程度（🔴 严重 / 🟡 建议 / 🟢 优化）标注每个问题，并提供修改建议。
|
|
||||||
```
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 📋 快速审查（简化版）
|
|
||||||
|
|
||||||
```
|
|
||||||
快速审查这段代码，只关注：
|
|
||||||
1. 明显的 Bug
|
|
||||||
2. 安全问题
|
|
||||||
3. 性能问题
|
|
||||||
|
|
||||||
代码：
|
|
||||||
```
|
|
||||||
[粘贴代码]
|
|
||||||
```
|
|
||||||
|
|
||||||
直接列出问题和修复方案，不需要详细解释。
|
|
||||||
```
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 🎯 特定维度审查
|
|
||||||
|
|
||||||
### 安全审查
|
|
||||||
|
|
||||||
```
|
|
||||||
请对这段代码进行安全审查：
|
|
||||||
|
|
||||||
```
|
|
||||||
[粘贴代码]
|
|
||||||
```
|
|
||||||
|
|
||||||
重点检查：
|
|
||||||
- SQL 注入
|
|
||||||
- XSS 攻击
|
|
||||||
- CSRF 漏洞
|
|
||||||
- 敏感信息泄露
|
|
||||||
- 权限控制
|
|
||||||
- 输入验证
|
|
||||||
|
|
||||||
列出所有安全风险并提供修复代码。
|
|
||||||
```
|
|
||||||
|
|
||||||
### 性能审查
|
|
||||||
|
|
||||||
```
|
|
||||||
请对这段代码进行性能审查：
|
|
||||||
|
|
||||||
```
|
|
||||||
[粘贴代码]
|
|
||||||
```
|
|
||||||
|
|
||||||
分析：
|
|
||||||
1. 时间复杂度
|
|
||||||
2. 空间复杂度
|
|
||||||
3. 数据库查询效率（如适用）
|
|
||||||
4. 内存使用
|
|
||||||
5. 并发处理
|
|
||||||
|
|
||||||
提供优化后的代码和性能对比。
|
|
||||||
```
|
|
||||||
|
|
||||||
### 可维护性审查
|
|
||||||
|
|
||||||
```
|
|
||||||
请从可维护性角度审查这段代码：
|
|
||||||
|
|
||||||
```
|
|
||||||
[粘贴代码]
|
|
||||||
```
|
|
||||||
|
|
||||||
评估：
|
|
||||||
1. 代码是否易于理解
|
|
||||||
2. 是否遵循单一职责原则
|
|
||||||
3. 是否有适当的注释
|
|
||||||
4. 是否易于测试
|
|
||||||
5. 是否易于扩展
|
|
||||||
|
|
||||||
提供重构建议。
|
|
||||||
```
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 🔄 PR 审查模板
|
|
||||||
|
|
||||||
```
|
|
||||||
请帮我审查这个 Pull Request：
|
|
||||||
|
|
||||||
## 变更描述
|
|
||||||
[描述这个 PR 做了什么]
|
|
||||||
|
|
||||||
## 变更的文件
|
|
||||||
|
|
||||||
### 文件 1: [文件名]
|
|
||||||
```
|
|
||||||
[粘贴代码变更]
|
|
||||||
```
|
|
||||||
|
|
||||||
### 文件 2: [文件名]
|
|
||||||
```
|
|
||||||
[粘贴代码变更]
|
|
||||||
```
|
|
||||||
|
|
||||||
请：
|
|
||||||
1. 检查代码质量
|
|
||||||
2. 验证逻辑正确性
|
|
||||||
3. 确认是否有遗漏的边界情况
|
|
||||||
4. 检查是否需要添加测试
|
|
||||||
5. 给出 Approve / Request Changes / Comment 建议
|
|
||||||
```
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 📊 审查报告模板
|
|
||||||
|
|
||||||
```
|
|
||||||
请生成一份代码审查报告：
|
|
||||||
|
|
||||||
代码：
|
|
||||||
```
|
|
||||||
[粘贴代码]
|
|
||||||
```
|
|
||||||
|
|
||||||
报告格式：
|
|
||||||
|
|
||||||
# 代码审查报告
|
|
||||||
|
|
||||||
## 概述
|
|
||||||
- 代码行数：
|
|
||||||
- 审查时间：
|
|
||||||
- 整体评分：X/10
|
|
||||||
|
|
||||||
## 问题汇总
|
|
||||||
| 严重程度 | 数量 |
|
|
||||||
|---------|------|
|
|
||||||
| 🔴 严重 | X |
|
|
||||||
| 🟡 建议 | X |
|
|
||||||
| 🟢 优化 | X |
|
|
||||||
|
|
||||||
## 详细问题
|
|
||||||
|
|
||||||
### 🔴 严重问题
|
|
||||||
1. [问题描述]
|
|
||||||
- 位置：第 X 行
|
|
||||||
- 原因：
|
|
||||||
- 修复：
|
|
||||||
|
|
||||||
### 🟡 建议改进
|
|
||||||
...
|
|
||||||
|
|
||||||
### 🟢 优化建议
|
|
||||||
...
|
|
||||||
|
|
||||||
## 总结与建议
|
|
||||||
```
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 🆚 代码对比审查
|
|
||||||
|
|
||||||
```
|
|
||||||
请对比审查这两个版本的代码：
|
|
||||||
|
|
||||||
## 原版本
|
|
||||||
```
|
|
||||||
[粘贴原代码]
|
|
||||||
```
|
|
||||||
|
|
||||||
## 新版本
|
|
||||||
```
|
|
||||||
[粘贴新代码]
|
|
||||||
```
|
|
||||||
|
|
||||||
请分析：
|
|
||||||
1. 新版本解决了什么问题
|
|
||||||
2. 新版本是否引入了新问题
|
|
||||||
3. 新版本的改进是否合理
|
|
||||||
4. 是否有更好的实现方式
|
|
||||||
```
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 💡 审查技巧
|
|
||||||
|
|
||||||
### 审查清单
|
|
||||||
|
|
||||||
```
|
|
||||||
请按照以下清单审查代码：
|
|
||||||
|
|
||||||
- [ ] 代码能正常运行
|
|
||||||
- [ ] 没有明显的 Bug
|
|
||||||
- [ ] 错误处理完善
|
|
||||||
- [ ] 没有安全漏洞
|
|
||||||
- [ ] 性能可接受
|
|
||||||
- [ ] 代码可读性好
|
|
||||||
- [ ] 有必要的注释
|
|
||||||
- [ ] 遵循项目规范
|
|
||||||
- [ ] 有对应的测试
|
|
||||||
|
|
||||||
代码：
|
|
||||||
```
|
|
||||||
[粘贴代码]
|
|
||||||
```
|
|
||||||
```
|
|
||||||
|
|
||||||
### 学习式审查
|
|
||||||
|
|
||||||
```
|
|
||||||
请审查这段代码，并教我：
|
|
||||||
1. 这段代码做了什么
|
|
||||||
2. 有哪些值得学习的地方
|
|
||||||
3. 有哪些可以改进的地方
|
|
||||||
4. 相关的最佳实践是什么
|
|
||||||
|
|
||||||
代码：
|
|
||||||
```
|
|
||||||
[粘贴代码]
|
|
||||||
```
|
|
||||||
```
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 使用建议
|
|
||||||
|
|
||||||
1. **提供上下文** - 说明代码的用途和背景
|
|
||||||
2. **指定重点** - 如果只关心某个方面，明确说明
|
|
||||||
3. **分批审查** - 代码太长时分文件审查
|
|
||||||
4. **跟进修复** - 审查后让 AI 帮你修复问题
|
|
||||||
|
|
|
||||||
|
|
@ -1,247 +1,35 @@
|
||||||
# 调试专家提示词
|
# 提示词：调试专家 (Debug Expert)
|
||||||
|
|
||||||
> 让 AI 帮你快速定位和解决 Bug
|
> 当遇到棘手的 Bug 时，使用此提示词进行系统化的根本原因分析。
|
||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
## 🔍 通用调试提示词
|
|
||||||
|
|
||||||
```
|
```
|
||||||
你是一位经验丰富的调试专家。我遇到了一个问题，请帮我分析和解决。
|
# Role: 调试专家 (Debug Expert)
|
||||||
|
|
||||||
## 问题描述
|
## Profile:
|
||||||
[描述你遇到的问题]
|
- **author:** aiai
|
||||||
|
- **version:** 0.1
|
||||||
|
- **language:** Chinese
|
||||||
|
- **description:** 我是一个逻辑严谨的调试专家，擅长使用系统化的方法来定位问题的根本原因。我像一个侦探，通过收集线索、提出假设、验证假设来逐步缩小范围，直到找到真凶（Root Cause）。
|
||||||
|
|
||||||
## 预期行为
|
## Rules:
|
||||||
[描述你期望发生什么]
|
1. **拒绝猜测**: 我从不凭空猜测，我的每一步都基于已有的事实和逻辑推理。
|
||||||
|
2. **系统化提问**: 我会通过一系列结构化的问题来向你索要必要的信息，例如：
|
||||||
|
* “这个 Bug 是稳定复现的，还是偶发的？”
|
||||||
|
* “你期望的行为是什么？实际发生的行为又是什么？”
|
||||||
|
* “提供一下完整的错误堆栈信息和相关的日志。”
|
||||||
|
* “在出现问题之前，你对代码或环境做了哪些改动？”
|
||||||
|
3. **二分法思想**: 我的核心策略是通过不断排除可能性来缩小问题范围。
|
||||||
|
4. **提供多种工具**: 我会建议使用不同的工具和方法来收集线索（如日志、调试器、监控工具）。
|
||||||
|
|
||||||
## 实际行为
|
## Workflow:
|
||||||
[描述实际发生了什么]
|
1. **信息收集 (Information Gathering)**: 我会首先让你提供所有与问题相关的上下文信息：错误日志、复现步骤、代码片段、环境配置等。
|
||||||
|
2. **提出假设 (Formulate Hypothesis)**: 基于已有信息，我会提出一个或多个关于问题根源的最可能假设。例如：“假设1：问题可能出在数据库连接池耗尽。”
|
||||||
|
3. **设计验证方案 (Design Verification Plan)**: 针对每个假设，我会设计一个最小化的实验或检查步骤来验证或排除它。例如：“为了验证假设1，请检查当前数据库的活跃连接数。”
|
||||||
|
4. **迭代推理 (Iterative Reasoning)**: 根据验证结果，我会排除错误的假设，并基于新的线索提出更精确的假设，然后重复第3步，直到找到根本原因。
|
||||||
|
5. **总结方案 (Provide Solution)**: 找到根本原因后，我会解释问题原理，并给出修复建议。
|
||||||
|
|
||||||
## 错误信息
|
## Init:
|
||||||
|
请描述你遇到的 Bug。越详细越好。
|
||||||
```
|
```
|
||||||
[粘贴错误信息]
|
|
||||||
```
|
|
||||||
|
|
||||||
## 相关代码
|
|
||||||
```
|
|
||||||
[粘贴相关代码]
|
|
||||||
```
|
|
||||||
|
|
||||||
## 已尝试的解决方案
|
|
||||||
[列出你已经尝试过的方法]
|
|
||||||
|
|
||||||
请：
|
|
||||||
1. 分析可能的原因（列出 2-3 个最可能的）
|
|
||||||
2. 提供具体的解决方案
|
|
||||||
3. 解释为什么会出现这个问题
|
|
||||||
4. 给出预防类似问题的建议
|
|
||||||
```
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 🐛 前端调试
|
|
||||||
|
|
||||||
### React 组件问题
|
|
||||||
|
|
||||||
```
|
|
||||||
我的 React 组件出现问题：
|
|
||||||
|
|
||||||
组件代码：
|
|
||||||
```jsx
|
|
||||||
[粘贴组件代码]
|
|
||||||
```
|
|
||||||
|
|
||||||
问题：[描述问题，如：状态不更新/渲染异常/性能问题]
|
|
||||||
|
|
||||||
控制台错误：
|
|
||||||
```
|
|
||||||
[粘贴错误]
|
|
||||||
```
|
|
||||||
|
|
||||||
请帮我：
|
|
||||||
1. 找出问题根源
|
|
||||||
2. 提供修复后的代码
|
|
||||||
3. 解释 React 的相关机制
|
|
||||||
```
|
|
||||||
|
|
||||||
### CSS 布局问题
|
|
||||||
|
|
||||||
```
|
|
||||||
我的 CSS 布局有问题：
|
|
||||||
|
|
||||||
HTML 结构：
|
|
||||||
```html
|
|
||||||
[粘贴 HTML]
|
|
||||||
```
|
|
||||||
|
|
||||||
CSS 样式：
|
|
||||||
```css
|
|
||||||
[粘贴 CSS]
|
|
||||||
```
|
|
||||||
|
|
||||||
期望效果：[描述或提供截图链接]
|
|
||||||
实际效果：[描述或提供截图链接]
|
|
||||||
|
|
||||||
请帮我修复布局问题，并解释原因。
|
|
||||||
```
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 🔧 后端调试
|
|
||||||
|
|
||||||
### API 接口问题
|
|
||||||
|
|
||||||
```
|
|
||||||
我的 API 接口有问题：
|
|
||||||
|
|
||||||
接口代码：
|
|
||||||
```python
|
|
||||||
[粘贴代码]
|
|
||||||
```
|
|
||||||
|
|
||||||
请求方式：[GET/POST/PUT/DELETE]
|
|
||||||
请求 URL：[URL]
|
|
||||||
请求参数：
|
|
||||||
```json
|
|
||||||
[参数]
|
|
||||||
```
|
|
||||||
|
|
||||||
期望响应：
|
|
||||||
```json
|
|
||||||
[期望的响应]
|
|
||||||
```
|
|
||||||
|
|
||||||
实际响应：
|
|
||||||
```json
|
|
||||||
[实际的响应]
|
|
||||||
```
|
|
||||||
|
|
||||||
错误日志：
|
|
||||||
```
|
|
||||||
[日志]
|
|
||||||
```
|
|
||||||
|
|
||||||
请帮我定位问题并修复。
|
|
||||||
```
|
|
||||||
|
|
||||||
### 数据库查询问题
|
|
||||||
|
|
||||||
```
|
|
||||||
我的数据库查询有问题：
|
|
||||||
|
|
||||||
SQL 语句：
|
|
||||||
```sql
|
|
||||||
[粘贴 SQL]
|
|
||||||
```
|
|
||||||
|
|
||||||
表结构：
|
|
||||||
```sql
|
|
||||||
[粘贴建表语句或描述]
|
|
||||||
```
|
|
||||||
|
|
||||||
期望结果：[描述]
|
|
||||||
实际结果：[描述或错误信息]
|
|
||||||
|
|
||||||
请帮我：
|
|
||||||
1. 分析 SQL 问题
|
|
||||||
2. 提供正确的查询
|
|
||||||
3. 解释优化建议（如果有性能问题）
|
|
||||||
```
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## ⚡ 性能调试
|
|
||||||
|
|
||||||
```
|
|
||||||
我的应用有性能问题：
|
|
||||||
|
|
||||||
## 问题表现
|
|
||||||
- [描述性能问题，如：加载慢/卡顿/内存泄漏]
|
|
||||||
|
|
||||||
## 环境信息
|
|
||||||
- 框架/语言：[如 React/Node.js/Python]
|
|
||||||
- 数据规模：[如 1000 条数据]
|
|
||||||
|
|
||||||
## 相关代码
|
|
||||||
```
|
|
||||||
[粘贴可能有问题的代码]
|
|
||||||
```
|
|
||||||
|
|
||||||
## 性能数据（如有）
|
|
||||||
- 加载时间：[X 秒]
|
|
||||||
- 内存占用：[X MB]
|
|
||||||
- CPU 使用：[X%]
|
|
||||||
|
|
||||||
请帮我：
|
|
||||||
1. 分析性能瓶颈
|
|
||||||
2. 提供优化方案
|
|
||||||
3. 给出优化后的代码
|
|
||||||
```
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 🔐 安全问题调试
|
|
||||||
|
|
||||||
```
|
|
||||||
请帮我检查这段代码的安全问题：
|
|
||||||
|
|
||||||
```
|
|
||||||
[粘贴代码]
|
|
||||||
```
|
|
||||||
|
|
||||||
请：
|
|
||||||
1. 列出所有潜在的安全漏洞
|
|
||||||
2. 按严重程度排序
|
|
||||||
3. 提供修复建议和代码
|
|
||||||
4. 解释每个漏洞的危害
|
|
||||||
```
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 💡 调试技巧
|
|
||||||
|
|
||||||
### 二分法定位
|
|
||||||
|
|
||||||
```
|
|
||||||
我的代码在某处出错，但不确定具体位置。
|
|
||||||
|
|
||||||
完整代码：
|
|
||||||
```
|
|
||||||
[粘贴代码]
|
|
||||||
```
|
|
||||||
|
|
||||||
错误表现：[描述]
|
|
||||||
|
|
||||||
请帮我用二分法定位问题：
|
|
||||||
1. 先确定问题在哪个模块/函数
|
|
||||||
2. 逐步缩小范围
|
|
||||||
3. 找到具体的问题行
|
|
||||||
```
|
|
||||||
|
|
||||||
### 最小复现
|
|
||||||
|
|
||||||
```
|
|
||||||
我遇到一个难以复现的 Bug：
|
|
||||||
|
|
||||||
问题描述：[描述]
|
|
||||||
发生频率：[总是/偶尔/特定条件]
|
|
||||||
相关代码：
|
|
||||||
```
|
|
||||||
[粘贴代码]
|
|
||||||
```
|
|
||||||
|
|
||||||
请帮我：
|
|
||||||
1. 分析可能的触发条件
|
|
||||||
2. 构造最小复现代码
|
|
||||||
3. 提供解决方案
|
|
||||||
```
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 使用建议
|
|
||||||
|
|
||||||
1. **提供完整上下文** - 错误信息、代码、环境都要给全
|
|
||||||
2. **描述清楚预期 vs 实际** - 让 AI 理解差距在哪
|
|
||||||
3. **列出已尝试的方案** - 避免重复建议
|
|
||||||
4. **一次只问一个问题** - 聚焦更容易解决
|
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue