关于 bundle
bundle 是用于将代码及相关上下文整理为 Markdown 或 GitHub Gist 的技能,适合需要分享代码片段、依赖和项目资料的开发者。它涵盖代码打包与 Gist 管理。
主要功能
- 01将文件与本地导入项打包
- 02在 CLAUDE.md 中生成项目上下文
- 03创建、查看、编辑和克隆 GitHub Gist
- 04提取导入项并检查依赖
适用场景
- 01分享代码片段以供评审
- 02将可运行演示整理为 Gist
- 03汇集源文件和文档以便分享
安装
复制下面的命令,在终端中运行。
$
npx skills add https:/ / github.com/ johnlindquist/ claude --skill bundle安装后在 Claude Code 中输入/bundle确认已加载。
详细介绍
代码打包器
将代码打包,以便通过 gist 或 markdown 分享。
前置要求
# GitHub CLI for gists
brew install gh
gh auth login
命令行参考
GitHub Gists
创建 Gist
# Single file gist (public)
gh gist create file.ts
# Private gist
gh gist create --private file.ts
# Multiple files
gh gist create file1.ts file2.ts file3.ts
# With description
gh gist create -d "My code snippet" file.ts
# From stdin
echo "console.log('hello')" | gh gist create -f hello.js
# Public with description
gh gist create -d "Utility functions" --public utils.ts helpers.ts
列出 Gist
# Your gists
gh gist list
# With limit
gh gist list --limit 20
# Public only
gh gist list --public
# Secret only
gh gist list --secret
查看 Gist
# View gist content
gh gist view <gist-id>
# View specific file
gh gist view <gist-id> --filename utils.ts
# Get raw content
gh gist view <gist-id> --raw
编辑 Gist
# Edit in editor
gh gist edit <gist-id>
# Add file to gist
gh gist edit <gist-id> --add newfile.ts
# Remove file
gh gist edit <gist-id> --remove oldfile.ts
克隆 Gist
# Clone as repo
gh gist clone <gist-id>
# Clone to specific directory
gh gist clone <gist-id> my-snippet
删除 Gist
gh gist delete <gist-id>
打包模式
打包文件及其依赖
#!/bin/bash
# bundle-file.sh - Bundle a file with its local imports
FILE=$1
OUTPUT=${2:-bundle.md}
echo "# Code Bundle" > $OUTPUT
echo "" >> $OUTPUT
echo "## Main File: $FILE" >> $OUTPUT
echo '```typescript' >> $OUTPUT
cat $FILE >> $OUTPUT
echo '```' >> $OUTPUT
# Extract and include imports
grep -E "^import.*from ['\"]\./" $FILE | while read import; do
# Extract path
path=$(echo $import | sed -E "s/.*from ['\"](.+)['\"].*/\1/")
resolved="${path}.ts"
if [ -f "$resolved" ]; then
echo "" >> $OUTPUT
echo "## $resolved" >> $OUTPUT
echo '```typescript' >> $OUTPUT
cat "$resolved" >> $OUTPUT
echo '```' >> $OUTPUT
fi
done
echo "Bundle created: $OUTPUT"
为项目创建 CLAUDE.md
#!/bin/bash
# Generate project context file
OUTPUT="CLAUDE.md"
echo "# Project Context" > $OUTPUT
echo "" >> $OUTPUT
# Package info
if [ -f "package.json" ]; then
echo "## Dependencies" >> $OUTPUT
echo '```json' >> $OUTPUT
jq '.dependencies' package.json >> $OUTPUT
echo '```' >> $OUTPUT
fi
# Key files
echo "" >> $OUTPUT
echo "## Key Files" >> $OUTPUT
for f in src/index.ts src/main.ts app.ts; do
if [ -f "$f" ]; then
echo "" >> $OUTPUT
echo "### $f" >> $OUTPUT
echo '```typescript' >> $OUTPUT
head -100 "$f" >> $OUTPUT
echo '```' >> $OUTPUT
fi
done
分享代码片段
# Quick share a file as gist
share-code() {
local file=$1
local desc=${2:-"Code snippet"}
gh gist create -d "$desc" --public "$file" | tail -1
}
# Usage
share-code src/utils.ts "Utility functions"
导入提取
查找所有导入
# Extract import statements
grep -h "^import" src/**/*.ts | sort -u
# External imports only
grep -h "^import" src/**/*.ts | grep -v "from '\.\." | sort -u
# Local imports only
grep -h "^import" src/**/*.ts | grep "from '\.\." | sort -u
依赖图
# Show what imports what
for f in src/**/*.ts; do
echo "=== $f ==="
grep "^import" "$f" | sed 's/.*from / <- /'
done
Gist 工作流
代码评审分享
# Share specific function for review
FILE=src/auth.ts
START=$(grep -n "export function login" $FILE | cut -d: -f1)
END=$(tail -n +$START $FILE | grep -n "^}" | head -1 | cut -d: -f1)
sed -n "${START},$((START+END-1))p" $FILE | \
gh gist create -d "Login function for review" -f login.ts
快速演示
# Create runnable demo
cat > /tmp/demo.ts << 'EOF'
// Demo: Array utilities
const nums = [1, 2, 3, 4, 5];
console.log(nums.filter(n => n % 2 === 0));
EOF
gh gist create -d "Quick demo" --public /tmp/demo.ts
文档 Gist
# Bundle docs with code
gh gist create \
-d "My utility library" \
README.md \
src/utils.ts \
examples/usage.ts
最佳实践
- 添加描述 - 使用
-d提供上下文 - 默认使用私有 - 除非有意分享
- 包含 README - 说明代码的用途
- 对重要的 gist 进行版本管理 - 克隆并提交更改
- 分享前先清理 - 移除密钥、注释
- 打包依赖 - 包含必要的上下文
评论
支持 Markdown