¿Cómo supervisas el cumplimiento del estilo de código en tu proyecto?
sobes.tech AI
Respuesta de la IA
Para mantener un estilo de código uniforme, utilizo las siguientes herramientas y procesos:
-
ESLint: Configuro reglas de formato y calidad del código (por ejemplo, Airbnb o Standard). ESLint ayuda a detectar errores de sintaxis, problemas de sangría, variables no utilizadas, etc.
// Ejemplo .eslintrc.js module.exports = { extends: 'airbnb-base', // O otro estilo elegido rules: { // Sobrescribir o agregar reglas 'semi': ['error', 'always'], 'quotes': ['error', 'single'] } }; -
Prettier: Integro Prettier para formatear automáticamente el código. Se encarga de espacios, saltos de línea, puntos y comas y otros detalles de formato, trabajando junto con ESLint (a través de plugins).
// Ejemplo .prettierrc.json { "semi": true, "singleQuote": true, "printWidth": 100 } -
Husky y lint-staged: Configuro hooks pre-commit con Husky. Con lint-staged ejecuto ESLint y Prettier solo en los archivos que han sido modificados (staged). Esto garantiza que solo se suba código formateado y verificado.
// Ejemplo package.json (parte) { "husky": { "hooks": { "pre-commit": "lint-staged" } }, "lint-staged": { "*.{js,jsx,ts,tsx}": [ "eslint --fix", "prettier --write" ], "*.{css,scss,less}": [ "stylelint --fix", // Si uso Stylelint "prettier --write" ], "*.{html,vue,svelte}": [ "prettier --write" ] } } -
Revisiones de código: En el proceso de revisión de código, presto atención al cumplimiento de las convenciones de estilo de código establecidas, incluso si las herramientas automáticas omiten algo o hay matices no cubiertos por las reglas.
-
Documentación: Mantengo una documentación mínima sobre el estilo de código aceptado en el proyecto (por ejemplo, en README o CONTRIBUTING.md), para que los nuevos miembros del equipo puedan familiarizarse rápidamente con las reglas.
-
Integración en IDE: Configuro los editores (VS Code, WebStorm, etc.) para formatear automáticamente al guardar y mostrar errores de ESLint directamente en el editor.