antfu
Aplicar las mejores prácticas de desarrollo web de Anthony Fu
A menudo los proyectos carecen de herramientas y configuración consistentes entre los miembros del equipo. Esta habilidad proporciona mejores prácticas opiniadas de Anthony Fu, incluyendo configuraciones de TypeScript, ESLint, Vitest y CI/CD que garantizan una calidad de código consistente y experiencia de desarrollo en cualquier proyecto web.
스킬 ZIP 다운로드
Claude에서 업로드
설정 → 기능 → 스킬 → 스킬 업로드로 이동
토글을 켜고 사용 시작
테스트해 보기
"antfu" 사용 중입니다. How should I configure TypeScript for a new project?
예상 결과:
- For a TypeScript project following Anthony Fu's best practices:
- ```json:tsconfig.json
- {
- "compilerOptions": {
- "target": "ESNext",
- "module": "ESNext",
- "moduleResolution": "Bundler",
- "strict": true,
- "jsx": "preserve",
- "resolveJsonModule": true,
- "isolatedModules": true,
- "esModuleInterop": true,
- "lib": ["ESNext", "DOM"],
- "skipLibCheck": true,
- "noEmit": true
- },
- "include": ["**/*.ts", "**/*.d.ts", "**/*.tsx"],
- "exclude": ["node_modules"]
- }
- ```
"antfu" 사용 중입니다. What ESLint configuration should I use?
예상 결과:
- Use @antfu/eslint-config as your base configuration:
- ```bash
- # Install dependencies
- pnpm add -D eslint @antfu/eslint-config
- ```
- ```js:eslint.config.js
- import antfu from '@antfu/eslint-config'
- export default antfu({
- stylistic: true,
- vue: false,
- jsonc: false,
- })
- ```
보안 감사
안전Pure documentation skill containing development best practices. Static findings are false positives from markdown code examples. No executable code, scripts, or runtime behavior. All detected patterns are standard documentation formatting showing example configurations.
품질 점수
만들 수 있는 것
Configurar un nuevo proyecto web con herramientas consistentes
Aplicar configuraciones estandarizadas para TypeScript, ESLint y pruebas al iniciar un nuevo proyecto para garantizar la consistencia desde el principio.
Incorporar miembros del equipo a las convenciones del código base existente
Referenciar esta habilidad para explicar las convenciones del proyecto para estilo de código, pruebas y CI/CD a los nuevos miembros del equipo.
Migrar proyecto existente a herramientas modernas
Revisar las configuraciones actuales del proyecto e identificar áreas para mejorar adoptando herramientas y convenciones modernas.
이 프롬프트를 사용해 보세요
Quiero configurar un nuevo proyecto TypeScript usando las mejores prácticas de Anthony Fu. ¿Cómo debería verse mi tsconfig.json? Incluye configuraciones para modo estricto, objetivo ESNext y cualquier otra configuración recomendada de TypeScript.
Ayúdame a configurar ESLint para mi proyecto usando @antfu/eslint-config. ¿Qué paquetes necesito instalar? ¿Qué debería contener mi eslint.config.js? Muéstrame cómo integrarlo con TypeScript y Vue si es necesario.
Estoy configurando un monorepo usando pnpm. ¿Cómo debería verse mi pnpm-workspace.yaml? ¿Cuáles son las configuraciones recomendadas para gestión de paquetes y cómo configuro @antfu/ni para comandos consistentes?
Quiero configurar CI/CD para mi proyecto usando GitHub Actions. ¿Qué archivo de flujo de trabajo debería usar? ¿Cuáles son las acciones recomendadas para ejecutar linting, pruebas y verificación de tipos? Referencia el patrón sxzz/workflows si es aplicable.
모범 사례
- Usa comandos de @antfu/ni (ni, nr, nx) para gestión de paquetes consistente en tu equipo, independientemente de la preferencia del gestor de paquetes
- Configura simple-git-hooks con lint-staged para ejecutar automáticamente linters en archivos preparados antes del commit
- Configura TypeScript con objetivo ESNext y modo estricto habilitado desde el inicio del proyecto para detectar errores de tipo tempranamente
피하기
- Mezclar diferentes gestores de paquetes (npm, yarn, pnpm) en el mismo proyecto sin usar @antfu/ni
- Desactivar el modo estricto de TypeScript o reglas de ESLint sin entender las implicaciones
- Omitir pre-commit hooks y verificaciones de CI para ahorrar tiempo - esto lleva a calidad de código inconsistente