developer-experience

用途

Developer Experience 是一个开发者体验（DX）优化技能，旨在优化开发者工作流、减少摩擦、自动化重复性任务，使开发过程更高效、更愉快。

适用时机包括：

搭建新项目或引导开发者入职时
识别并消除重复性任务时
改善构建与测试执行时间时
优化开发工作流时
创建实用的别名与快捷方式时
配置 IDE 环境与工具时

主要能力

该技能覆盖以下方面：

环境搭建（Environment Setup）：简化入职流程至 5 分钟以内
工作流优化（Workflow Optimization）：识别并自动化重复性任务
工具增强（Tooling Enhancement）：配置 IDE 设置、Git 钩子与命令行命令
文档（Documentation）：创建安装指南与故障排查文档
自动化（Automation）：为常见任务创建脚本与命令
减少摩擦（Friction Reduction）：消除手动步骤并改善反馈循环

具体优化领域如下：

环境搭建

目标：入职时间控制在 5 分钟以内、智能默认值、自动化依赖安装、有用的错误提示、清晰的安装说明。

交付物：带有清晰安装步骤的 README、安装脚本（setup.sh、setup.ps1）、环境校验、依赖检查、配置模板。

开发工作流

识别重复性任务：代码生成、数据库迁移、测试运行、构建过程、部署步骤。

创建自动化：npm/yarn 脚本、Makefile 命令、Shell 别名、自定义 CLI 工具、任务运行器。

工具增强

IDE 配置：EditorConfig、ESLint/Prettier 配置、VS Code 设置、调试配置、代码片段库。

Git 钩子：pre-commit 钩子（lint、格式化）、提交信息校验、pre-push 钩子（测试）、post-merge 钩子（依赖更新）。

CLI 命令：项目专属命令、开发快捷方式、数据库工具、测试辅助工具。

使用方式

该技能通过分析开发工作流并给出改进建议来使用。资料中的示例调用方式包括：

“Analyze the development workflow and suggest improvements”（分析开发工作流并提出改进建议）
“Set up this project for optimal developer experience”（为最佳开发者体验搭建此项目）
“Create helpful npm scripts for common tasks”（为常见任务创建实用的 npm 脚本）
“Set up git hooks for code quality checks”（为代码质量检查设置 git 钩子）
“Create shortcuts for common development tasks”（为常见开发任务创建快捷方式）

示例一：项目安装流程优化

输入：“Optimize the setup process for this project”

输出会先列出当前的安装问题（手动安装依赖、无环境校验、安装说明不清、缺少开发工具），然后给出改进方案，包括：

安装脚本（setup.sh）：检查 Node.js 版本（低于 18 报错退出）、安装依赖、复制 .env、运行数据库迁移。

#!/bin/bash
# setup.sh
echo "Setting up development environment..."

# Check Node.js version
node_version=$(node -v | cut -d'v' -f2 | cut -d'.' -f1)
if [ "$node_version" -lt 18 ]; then
  echo "Error: Node.js 18+ required"
  exit 1
fi

# Install dependencies
npm install

# Setup environment
cp .env.example .env

# Run database migrations
npm run db:migrate

echo "Setup complete! Run 'npm run dev' to start."

增强后的 package.json 脚本，包含 dev、test、test:watch、test:coverage、lint、lint:fix、format、db:migrate、db:seed、setup 等命令。

{
  "scripts": {
    "dev": "nodemon src/index.js",
    "test": "jest",
    "test:watch": "jest --watch",
    "test:coverage": "jest --coverage",
    "lint": "eslint .",
    "lint:fix": "eslint . --fix",
    "format": "prettier --write .",
    "db:migrate": "knex migrate:latest",
    "db:seed": "knex seed:run",
    "setup": "bash setup.sh"
  }
}

Git 钩子示例（.husky/pre-commit）：

#!/bin/sh
npm run lint
npm run test

示例二：工作流自动化

输入：“Create shortcuts for common development tasks”

输出给出以下三类快捷方式：

Makefile 命令：

.PHONY: dev test lint format db-setup

dev:
 npm run dev

test:
 npm test

lint:
 npm run lint

format:
 npm run format

db-setup:
 npm run db:migrate
 npm run db:seed

clean:
 rm -rf node_modules dist .next

install:
 npm install

Shell 别名，可加入 ~/.zshrc 或 ~/.bashrc：

alias dev="npm run dev" alias test="npm test" alias lint="npm run lint" alias format="npm run format"

VS Code 任务（.vscode/tasks.json），包含运行测试与启动开发服务器两个任务：

{
  "version": "2.0.0",
  "tasks": [
    {
      "label": "Run Tests",
      "type": "shell",
      "command": "npm test",
      "group": "test"
    },
    {
      "label": "Start Dev Server",
      "type": "shell",
      "command": "npm run dev",
      "group": "build",
      "isBackground": true
    }
  ]
}

适用场景

项目安装流程优化
工作流自动化
工具链配置
开发者入职引导
减少开发摩擦
改善构建/测试时间

最佳实践

DX 原则：

正常工作时无感（Invisible When Working）：好的 DX 在正常运行时是顺畅无感的
出错时清晰（Obvious When Broken）：失败时给出清晰的错误信息
快速反馈（Fast Feedback）：快速的构建/测试周期
清晰文档（Clear Documentation）：真正可用的安装指南
有用的默认值（Helpful Defaults）：开箱即用的合理配置

成功指标：

首次成功时间（Time to First Success）：新开发者多久能跑起应用？
手动步骤数：消除了多少手动步骤
构建/测试时间：常见任务的执行时间
开发者满意度：对工作流改进的反馈

常见改进方向：

快速反馈：开发热重载、快速测试执行、快速构建、即时 lint 反馈
清晰错误：有用的错误信息、带上下文的堆栈、安装校验、依赖检查
自动化：一键安装、自动化测试、代码生成、部署自动化

参考文件

references/ONBOARDING_GUIDE.template.md — 开发者入职指南模板，包含环境搭建、逐日任务与故障排查。

限制

资料未提供该技能的具体安装方式、运行环境要求、收费模式与价格、支持平台范围等信息。