ESLint + @typescript-eslint
Configure ESLint con el plugin @typescript-eslint para detectar problemas relacionados con los tipos y aplicar un estilo coherente.
ESLint + @typescript-eslint es una lección gratuita de TypeScript Academy en CoddyKit. Esta es la lección 1 de 3. Puedes leer la lección completa abajo gratuitamente — luego la practicas en el navegador con un editor de código integrado y un tutor de IA 24/7. Forma parte de la ruta de aprendizaje de TypeScript Academy, y tu progreso se sincroniza en la web y la app de CoddyKit. El curso de TypeScript Academy incluye 3 lecciones en total.
Introducción
Objetivo: Usar ESLint con @typescript-eslint para detectar errores y aplicar un estilo coherente en proyectos de TypeScript.
Instalación
Instale ESLint y también @typescript-eslint/parser y @typescript-eslint/eslint-plugin.
npm install --save-dev eslint @typescript-eslint/parser @typescript-eslint/eslint-pluginConfiguración
Configure ESLint para usar el analizador de TS y las reglas recomendadas. Añada reglas específicas del proyecto según sea necesario.
// .eslintrc.js
module.exports = {
parser: "@typescript-eslint/parser",
plugins: ["@typescript-eslint"],
extends: [
"eslint:recommended",
"plugin:@typescript-eslint/recommended"
],
rules: {
"@typescript-eslint/no-unused-vars": "warn"
}
};Ejemplo de lint
ESLint destaca los argumentos que faltan, las variables no utilizadas y los problemas de estilo al usar el analizador compatible con TS.
// demo.ts
function greet(name: string) {
console.log("Hello", name)
}
greet("Ada")
greet() // ESLint error: missing arg
Reglas conscientes de los tipos
Enlace tsconfig.json en parserOptions para las reglas que necesitan información de tipos, por ejemplo, para detectar promesas no gestionadas.
// tsconfig.json must be linked for type-aware rules
{
"parserOptions": {
"project": "./tsconfig.json"
}
}
// Example: no-floating-promises
async function f() {
fetch("/api") // ESLint error: unhandled promise
}Ejecutar lint
Ejecute ESLint en su base de código. Añada --fix para aplicar automáticamente las correcciones seguras.
npx eslint "src/**/*.{ts,tsx}" --fixPregunta
Comprobación rápida: ¿Por qué usar @typescript-eslint además del núcleo de ESLint?
Resumen
Resumen: instale ESLint + @typescript-eslint, configure el analizador, amplíe la configuración recomendada y ejecute el linter con reglas conscientes de los tipos para mantener un código limpio.
Preguntas frecuentes
¿La lección «ESLint + @typescript-eslint» es gratis?
Sí — el texto completo de «ESLint + @typescript-eslint» es gratis para leer aquí en la web. Para practicarla de forma interactiva (editor de código integrado y tutor de IA 24/7) y desbloquear el resto del curso de TypeScript Academy, actualiza a CoddyKit PRO. El curso de TypeScript Academy incluye 3 lecciones en total.
¿Qué aprenderé en «ESLint + @typescript-eslint»?
Configure ESLint con el plugin @typescript-eslint para detectar problemas relacionados con los tipos y aplicar un estilo coherente. Practicas TypeScript Academy con código real que ejecutas directamente en el navegador, y un tutor de IA 24/7 responde tus preguntas mientras trabajas en la lección.
¿Necesito experiencia previa para empezar TypeScript Academy?
No se requiere experiencia previa. TypeScript Academy en CoddyKit está estructurado para principiantes hasta estudiantes avanzados, así que puedes empezar aquí o desde el inicio y avanzar a tu ritmo. Esta es la lección 1 de 3.
¿Cuánto tiempo toma la lección «ESLint + @typescript-eslint»?
La mayoría de las lecciones de CoddyKit toman alrededor de 5–10 minutos. Cada una es compacta e interactiva, así que avanzas constantemente y retomas exactamente por donde dejaste en la web y la app.
¿Puedo escribir y ejecutar código en esta lección de TypeScript Academy?
Sí. Cada lección de TypeScript Academy incluye un editor de código integrado, así que escribes y ejecutas código real directamente en tu navegador y obtienes retroalimentación instantánea de IA — sin configuración local necesaria.
Todas las lecciones de este curso
- ESLint + @typescript-eslint
- Integración con Prettier y conflictos entre reglas
- Conjuntos de reglas habituales en proyectos reales