Agent skill
git-ci-cd-manager
Automate Git workflow with conventional commits, setup GitHub Actions CI/CD, configure Husky hooks, manage PR automation, and handle semantic releases
Install this agent skill to your Project
npx add-skill https://github.com/majiayu000/claude-skill-registry/tree/main/skills/development/git-ci-cd-manager-deve1993-quickfy-website
SKILL.md
Git & CI/CD Manager
Expert skill for automating Git workflows, setting up CI/CD pipelines, managing conventional commits, and implementing release automation. Specializes in GitHub Actions, Husky hooks, semantic versioning, and PR management.
Core Capabilities
1. Conventional Commits
- Commitizen: Interactive commit message generation
- Commitlint: Enforce commit message conventions
- Semantic Commit Types: feat, fix, docs, style, refactor, test, chore
- Scopes: Component-based scopes (@scope/package)
- Breaking Changes: BREAKING CHANGE footer
- Auto-linking: Link to issues and PRs
2. GitHub Actions CI/CD
- Test Pipeline: Run tests on PR and push
- Build Pipeline: Build and verify artifacts
- Deploy Pipeline: Automated deployment (staging, production)
- Release Pipeline: Automated semantic releases
- PR Automation: Auto-label, auto-assign, auto-review
- Scheduled Jobs: Dependency updates, security scans
- Matrix Builds: Test across multiple Node versions, OS
3. Git Hooks (Husky)
- Pre-commit: Lint staged files, run type check
- Commit-msg: Validate commit message format
- Pre-push: Run tests before push
- Post-merge: Install dependencies if package.json changed
- Post-checkout: Clean build artifacts
- Custom Hooks: Project-specific automation
4. Lint-Staged
- ESLint: Auto-fix linting errors
- Prettier: Auto-format code
- TypeScript: Type check only changed files
- Tests: Run tests for changed files only
- Custom Commands: Project-specific linting
5. Release Management
- Semantic Release: Automated versioning based on commits
- Changelog Generation: Auto-generate from commits
- Git Tags: Create and push version tags
- NPM Publishing: Automated package publishing
- GitHub Releases: Create release notes
- Version Bumping: Update package.json, lockfiles
6. Branch Management
- Gitflow: Main, develop, feature, hotfix branches
- PR Templates: Standardized PR descriptions
- Branch Protection: Required reviews, status checks
- Auto-merge: Merge when checks pass
- Conflict Detection: Early conflict warnings
7. PR Automation
- Auto-labeling: Based on changed files or PR title
- Auto-assignment: Assign reviewers by code ownership
- Size Labeling: Small, medium, large, xlarge
- Status Checks: Required checks before merge
- Comment Templates: Review guidelines
Workflow
Phase 1: Initial Setup
-
Configure Git
- Set up user info
- Configure line endings
- Set up .gitignore
- Configure Git aliases
-
Install Tools
- Husky for Git hooks
- Commitizen for commit messages
- Commitlint for validation
- Lint-staged for pre-commit
- Semantic Release for automation
-
Create Templates
- GitHub Actions workflows
- PR templates
- Issue templates
- Contributing guidelines
Phase 2: GitHub Actions Setup
-
Create Workflows
- Test workflow (on PR, push)
- Build workflow
- Deploy workflow (staging, production)
- Release workflow
- Scheduled workflows
-
Configure Secrets
- NPM_TOKEN for publishing
- DEPLOY_TOKEN for deployments
- Other service credentials
-
Set Up Environments
- Staging environment
- Production environment
- Environment protection rules
Phase 3: Automation
-
Configure Hooks
- Pre-commit: lint + type check
- Commit-msg: validate format
- Pre-push: run tests
-
Set Up PR Automation
- Auto-labeling workflow
- Auto-assignment
- Size labeling
- Stale PR management
-
Release Automation
- Semantic release configuration
- Changelog generation
- NPM publishing
- GitHub release creation
Conventional Commits Guide
Commit Message Format
<type>(<scope>): <subject>
<body>
<footer>
Types
| Type | Description | Version Bump |
|---|---|---|
feat |
New feature | Minor (0.x.0) |
fix |
Bug fix | Patch (0.0.x) |
docs |
Documentation only | None |
style |
Code style (formatting, etc.) | None |
refactor |
Code refactoring | None |
perf |
Performance improvement | Patch |
test |
Add or update tests | None |
chore |
Maintenance tasks | None |
ci |
CI/CD changes | None |
build |
Build system changes | None |
revert |
Revert previous commit | Depends |
Examples
# Feature with scope
feat(button): add loading state
Adds isLoading prop to Button component
Shows spinner when loading is true
Closes #123
# Breaking change
feat(forms)!: change validation API
BREAKING CHANGE: The validateForm function now returns a Promise
instead of synchronous validation result.
Migration guide available at docs/migration/v2.md
# Bug fix
fix(input): prevent double onChange call
Fixed issue where onChange was called twice on blur
Fixes #456
# Multiple changes
feat(components): add new Card variants
- Add 'elevated' variant with shadow
- Add 'outlined' variant with border
- Update Storybook stories
# Simple fix
fix: typo in README
Commitizen Interactive
# Run commitizen
npm run commit
# Interactive prompts:
? Select the type of change: feat
? What is the scope?: button
? Write a short description: add loading state
? Provide a longer description: (press enter to skip)
? Are there any breaking changes? No
? Does this change affect any open issues? Yes
? Add issue references: Closes #123
# Generated commit:
feat(button): add loading state
Closes #123
GitHub Actions Templates
Test Workflow
# .github/workflows/test.yml
name: Test
on:
push:
branches: [main, develop]
pull_request:
branches: [main, develop]
jobs:
test:
runs-on: ubuntu-latest
strategy:
matrix:
node-version: [18.x, 20.x]
steps:
- uses: actions/checkout@v4
- name: Setup Node.js ${{ matrix.node-version }}
uses: actions/setup-node@v4
with:
node-version: ${{ matrix.node-version }}
cache: 'npm'
- name: Install dependencies
run: npm ci
- name: Lint
run: npm run lint
- name: Type check
run: npm run type-check
- name: Run tests
run: npm test -- --coverage
- name: Upload coverage
uses: codecov/codecov-action@v3
if: matrix.node-version == '20.x'
with:
file: ./coverage/lcov.info
fail_ci_if_error: true
build:
runs-on: ubuntu-latest
needs: test
steps:
- uses: actions/checkout@v4
- name: Setup Node.js
uses: actions/setup-node@v4
with:
node-version: '20.x'
cache: 'npm'
- name: Install dependencies
run: npm ci
- name: Build
run: npm run build
- name: Check bundle size
run: npm run size-check
Release Workflow
# .github/workflows/release.yml
name: Release
on:
push:
branches: [main]
permissions:
contents: write
issues: write
pull-requests: write
id-token: write
jobs:
release:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v4
with:
fetch-depth: 0
persist-credentials: false
- name: Setup Node.js
uses: actions/setup-node@v4
with:
node-version: '20.x'
registry-url: 'https://registry.npmjs.org'
- name: Install dependencies
run: npm ci
- name: Build
run: npm run build
- name: Run tests
run: npm test
- name: Semantic Release
env:
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
run: npx semantic-release
Deploy Workflow
# .github/workflows/deploy.yml
name: Deploy
on:
push:
branches: [main]
workflow_dispatch:
inputs:
environment:
description: 'Environment to deploy to'
required: true
type: choice
options:
- staging
- production
jobs:
deploy-staging:
if: github.event_name == 'push' || github.event.inputs.environment == 'staging'
runs-on: ubuntu-latest
environment:
name: staging
url: https://staging.example.com
steps:
- uses: actions/checkout@v4
- name: Setup Node.js
uses: actions/setup-node@v4
with:
node-version: '20.x'
cache: 'npm'
- name: Install dependencies
run: npm ci
- name: Build
run: npm run build
env:
NODE_ENV: production
VITE_API_URL: ${{ secrets.STAGING_API_URL }}
- name: Deploy to Staging
run: npm run deploy:staging
env:
DEPLOY_TOKEN: ${{ secrets.STAGING_DEPLOY_TOKEN }}
deploy-production:
if: github.event.inputs.environment == 'production'
runs-on: ubuntu-latest
environment:
name: production
url: https://example.com
steps:
- uses: actions/checkout@v4
- name: Setup Node.js
uses: actions/setup-node@v4
with:
node-version: '20.x'
cache: 'npm'
- name: Install dependencies
run: npm ci
- name: Build
run: npm run build
env:
NODE_ENV: production
VITE_API_URL: ${{ secrets.PRODUCTION_API_URL }}
- name: Deploy to Production
run: npm run deploy:production
env:
DEPLOY_TOKEN: ${{ secrets.PRODUCTION_DEPLOY_TOKEN }}
- name: Notify Slack
if: success()
uses: slackapi/slack-github-action@v1
with:
payload: |
{
"text": "🚀 Production deployment successful!"
}
env:
SLACK_WEBHOOK_URL: ${{ secrets.SLACK_WEBHOOK }}
PR Automation Workflow
# .github/workflows/pr-automation.yml
name: PR Automation
on:
pull_request:
types: [opened, edited, synchronize]
permissions:
contents: read
pull-requests: write
jobs:
auto-label:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v4
- name: Label based on size
uses: codelytv/pr-size-labeler@v1
with:
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
xs_label: 'size/xs'
xs_max_size: '10'
s_label: 'size/s'
s_max_size: '100'
m_label: 'size/m'
m_max_size: '500'
l_label: 'size/l'
l_max_size: '1000'
xl_label: 'size/xl'
- name: Label based on files
uses: actions/labeler@v5
with:
repo-token: ${{ secrets.GITHUB_TOKEN }}
configuration-path: .github/labeler.yml
auto-assign:
runs-on: ubuntu-latest
steps:
- name: Auto-assign reviewers
uses: kentaro-m/auto-assign-action@v1
with:
configuration-path: .github/auto-assign.yml
Husky Configuration
Setup Husky
# Install Husky
npm install --save-dev husky
# Initialize Husky
npx husky init
# Creates .husky/ directory with pre-commit hook
Pre-commit Hook
# .husky/pre-commit
#!/usr/bin/env sh
. "$(dirname -- "$0")/_/husky.sh"
# Run lint-staged
npx lint-staged
# Run type check (optional, can be slow)
# npm run type-check
Commit-msg Hook
# .husky/commit-msg
#!/usr/bin/env sh
. "$(dirname -- "$0")/_/husky.sh"
# Validate commit message with commitlint
npx --no -- commitlint --edit $1
Pre-push Hook
# .husky/pre-push
#!/usr/bin/env sh
. "$(dirname -- "$0")/_/husky.sh"
# Run tests before push
npm test
# Check if build succeeds
npm run build
Post-merge Hook
# .husky/post-merge
#!/usr/bin/env sh
. "$(dirname -- "$0")/_/husky.sh"
# Check if package.json changed
changed_files="$(git diff-tree -r --name-only --no-commit-id ORIG_HEAD HEAD)"
if echo "$changed_files" | grep --quiet "package.json"; then
echo "📦 package.json changed, running npm install..."
npm install
fi
Configuration Files
Commitlint Configuration
// commitlint.config.js
module.exports = {
extends: ['@commitlint/config-conventional'],
rules: {
'type-enum': [
2,
'always',
[
'feat', // New feature
'fix', // Bug fix
'docs', // Documentation
'style', // Formatting
'refactor', // Code refactoring
'perf', // Performance
'test', // Tests
'chore', // Maintenance
'ci', // CI/CD
'build', // Build system
'revert', // Revert commit
],
],
'scope-enum': [
2,
'always',
[
'button',
'input',
'modal',
'form',
'layout',
'theme',
'deps',
'config',
// Add your component scopes
],
],
'subject-case': [2, 'always', 'lower-case'],
'subject-empty': [2, 'never'],
'subject-full-stop': [2, 'never', '.'],
'type-case': [2, 'always', 'lower-case'],
'type-empty': [2, 'never'],
'body-leading-blank': [2, 'always'],
'footer-leading-blank': [2, 'always'],
'header-max-length': [2, 'always', 100],
},
}
Lint-Staged Configuration
// lint-staged.config.js
module.exports = {
'*.{ts,tsx}': [
'eslint --fix',
'prettier --write',
// Type check only staged files (faster than full type check)
() => 'tsc --noEmit',
],
'*.{js,jsx}': ['eslint --fix', 'prettier --write'],
'*.{json,md,yml,yaml}': ['prettier --write'],
'*.{css,scss}': ['stylelint --fix', 'prettier --write'],
// Run tests for changed files
'*.{ts,tsx,js,jsx}': ['npm test -- --findRelatedTests --passWithNoTests'],
}
Semantic Release Configuration
// release.config.js
module.exports = {
branches: ['main'],
plugins: [
'@semantic-release/commit-analyzer',
'@semantic-release/release-notes-generator',
'@semantic-release/changelog',
'@semantic-release/npm',
'@semantic-release/github',
[
'@semantic-release/git',
{
assets: ['package.json', 'CHANGELOG.md'],
message:
'chore(release): ${nextRelease.version} [skip ci]\n\n${nextRelease.notes}',
},
],
],
}
Labeler Configuration
# .github/labeler.yml
'type: feature':
- 'src/**/*.{ts,tsx}'
'type: fix':
- 'src/**/*.{ts,tsx}'
'type: docs':
- '*.md'
- 'docs/**/*'
'type: tests':
- '**/*.test.{ts,tsx}'
- '**/*.spec.{ts,tsx}'
'type: ci':
- '.github/**/*'
'area: components':
- 'src/components/**/*'
'area: utils':
- 'src/utils/**/*'
'area: styles':
- 'src/styles/**/*'
- '**/*.css'
- '**/*.scss'
Auto-assign Configuration
# .github/auto-assign.yml
addReviewers: true
addAssignees: false
reviewers:
- reviewer1
- reviewer2
- reviewer3
numberOfReviewers: 2
# Assign based on file patterns
filePathAssignments:
- patterns:
- 'src/components/**'
reviewers:
- component-expert
- patterns:
- '**/*.test.ts'
reviewers:
- testing-expert
Package.json Scripts
{
"scripts": {
"commit": "cz",
"prepare": "husky",
"lint": "eslint src --ext .ts,.tsx",
"lint:fix": "eslint src --ext .ts,.tsx --fix",
"type-check": "tsc --noEmit",
"test": "vitest",
"test:ci": "vitest run --coverage",
"build": "tsup",
"build:check": "npm run build && npm run size-check",
"size-check": "size-limit",
"release": "semantic-release",
"release:dry": "semantic-release --dry-run"
},
"config": {
"commitizen": {
"path": "cz-conventional-changelog"
}
}
}
PR Template
<!-- .github/pull_request_template.md -->
## Description
<!-- Describe your changes in detail -->
## Type of Change
<!-- Mark with an 'x' -->
- [ ] 🐛 Bug fix (non-breaking change which fixes an issue)
- [ ] ✨ New feature (non-breaking change which adds functionality)
- [ ] 💥 Breaking change (fix or feature that would cause existing functionality to not work as expected)
- [ ] 📝 Documentation update
- [ ] 🎨 Style update (formatting, renaming)
- [ ] ♻️ Code refactoring (no functional changes)
- [ ] ⚡ Performance improvement
- [ ] ✅ Test update
- [ ] 🔧 Chore (updating build tasks, package manager configs, etc)
## Related Issues
<!-- Link related issues here -->
Closes #
Related to #
## Checklist
- [ ] My code follows the project's style guidelines
- [ ] I have performed a self-review of my code
- [ ] I have commented my code, particularly in hard-to-understand areas
- [ ] I have made corresponding changes to the documentation
- [ ] My changes generate no new warnings
- [ ] I have added tests that prove my fix is effective or that my feature works
- [ ] New and existing unit tests pass locally with my changes
- [ ] Any dependent changes have been merged and published
## Screenshots (if applicable)
<!-- Add screenshots here -->
## Additional Notes
<!-- Any additional information -->
Branch Protection Rules
Main Branch Protection
# Recommended settings for main branch:
Required status checks:
- Test (Node 18.x)
- Test (Node 20.x)
- Build
- Lint
Require branches to be up to date before merging: ✓
Require pull request reviews:
- Required approving reviews: 1
- Dismiss stale reviews: ✓
- Require review from Code Owners: ✓
Require signed commits: ✓ (optional)
Include administrators: ✓
Restrict who can push: Admins only
Best Practices
Commit Messages
- Use Imperative Mood: "add feature" not "added feature"
- Be Specific: "fix button hover state" not "fix bug"
- Limit Subject Line: Max 72 characters
- Use Body for Details: Explain why, not what
- Reference Issues: Always link to issues
Branching Strategy
- Gitflow: main (production), develop (integration), feature/* (new features)
- Branch Naming:
feature/add-button-component,fix/modal-close-bug,docs/update-readme - Short-lived Branches: Merge within a few days
- Regular Rebase: Keep feature branches up to date
- Clean History: Squash commits before merging
CI/CD
- Fast Feedback: Run quick checks first (lint, type check)
- Parallel Jobs: Run tests and build in parallel
- Cache Dependencies: Use npm cache to speed up builds
- Fail Fast: Stop pipeline on first failure
- Clear Errors: Provide actionable error messages
Pull Requests
- Small PRs: Easier to review, faster to merge
- Self-Review: Review your own PR before requesting review
- Clear Description: Explain what, why, and how
- Link Issues: Always reference related issues
- Tests: Add tests for new features and bug fixes
Releases
- Semantic Versioning: Follow semver strictly
- Changelog: Auto-generate from commits
- Release Notes: Highlight breaking changes
- Pre-releases: Use for beta testing
- Rollback Plan: Be able to revert quickly
Troubleshooting
Husky Hooks Not Running
# Reinstall Husky
rm -rf .husky
npx husky init
# Re-add hooks
npm run prepare
# Check Git hooks directory
ls -la .git/hooks/
Commitlint Failing
# Test commit message
echo "feat: add new feature" | npx commitlint
# Check configuration
npx commitlint --print-config
# Common issues:
# - Wrong type (use feat, fix, docs, etc.)
# - Missing scope when required
# - Subject in wrong case
# - Subject ends with period
GitHub Actions Failing
# Test workflow locally
npm install -g act
act -l # List workflows
act # Run workflows
# Common issues:
# - Missing secrets
# - Wrong Node version
# - Dependencies not cached
# - Environment variables not set
Semantic Release Not Publishing
# Dry run to see what would be released
npm run release:dry
# Common issues:
# - No conventional commits since last release
# - NPM_TOKEN not set
# - Wrong branch (must be main/master)
# - No permissions to publish
When to Use This Skill
Activate this skill when you need to:
- Set up Git workflow for new project
- Configure conventional commits
- Create GitHub Actions pipelines
- Set up Husky pre-commit hooks
- Implement lint-staged
- Configure semantic release
- Create PR templates
- Set up branch protection rules
- Automate changelog generation
- Implement CI/CD pipeline
- Configure auto-merge rules
- Set up deployment workflows
- Create custom Git hooks
- Troubleshoot Git automation issues
Output Format
When setting up Git automation, provide:
- Complete Configuration: All config files (commitlint, husky, etc.)
- GitHub Actions Workflows: Test, build, deploy, release
- Setup Scripts: Automated installation and configuration
- Documentation: How to use the system
- PR/Issue Templates: Standardized templates
- Troubleshooting Guide: Common issues and solutions
Always create production-ready, well-documented Git automation that follows industry best practices and security guidelines.
Didn't find tool you were looking for?