TypeScript Academy · Lección

Creación de una herramienta de linting sencilla

Cree una herramienta de diagnóstico personalizada con la API del compilador.

Lección 4 de 413 pasos

Creación de una herramienta de linting sencilla es una lección gratuita de TypeScript Academy en CoddyKit. Esta es la lección 4 de 4. 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 4 lecciones en total.

¿Qué es una herramienta de linting?

Una herramienta de linting analiza el código fuente para informar de problemas de estilo o corrección. Usar la API del compilador de TypeScript permite crear reglas conscientes de los tipos que los plugins de ESLint no pueden conseguir por sí solos.

// Goal: warn when console.log is called in TypeScript files

Configuración del proyecto

Cree un script de Node.js que cargue un programa de TypeScript, recorra el AST e informe de los diagnósticos.

import ts from "typescript";
import path from "path";

const files = ["src/index.ts"];
const program = ts.createProgram(files, { strict: true });

Definir una regla

Una regla es una función que recibe un nodo del AST y devuelve un mensaje de diagnóstico opcional si se infringe la regla.

type Diagnostic = { file: string; line: number; message: string };

function noConsoleLog(node: ts.Node, sf: ts.SourceFile): Diagnostic | null {
  if (!ts.isCallExpression(node)) return null;
  const expr = node.expression.getText(sf);
  if (expr !== "console.log") return null;
  const { line } = sf.getLineAndCharacterOfPosition(node.pos);
  return { file: sf.fileName, line: line + 1, message: "No console.log allowed" };
}

Recorrer el AST

Escriba un recorrido recursivo que aplique todas las reglas a cada nodo de cada archivo fuente.

function walk(
  node: ts.Node,
  sf: ts.SourceFile,
  rules: ((n: ts.Node, sf: ts.SourceFile) => Diagnostic | null)[]
): Diagnostic[] {
  const diags: Diagnostic[] = [];
  for (const rule of rules) {
    const d = rule(node, sf);
    if (d) diags.push(d);
  }
  ts.forEachChild(node, child => diags.push(...walk(child, sf, rules)));
  return diags;
}

Ejecutar el linter

Recorra todos los archivos fuente, aplique las reglas e imprima los diagnósticos.

const rules = [noConsoleLog];
const allDiagnostics: Diagnostic[] = [];

for (const sf of program.getSourceFiles()) {
  if (!sf.isDeclarationFile) {
    allDiagnostics.push(...walk(sf, sf, rules));
  }
}

allDiagnostics.forEach(d =>
  console.log(`${d.file}:${d.line} — ${d.message}`)
);

Añadir una regla consciente de los tipos

Use el comprobador de tipos para crear reglas que dependan del tipo de TypeScript de una expresión.

const checker = program.getTypeChecker();

function noAnyReturn(node: ts.Node, sf: ts.SourceFile): Diagnostic | null {
  if (!ts.isFunctionDeclaration(node)) return null;
  const sig = checker.getSignatureFromDeclaration(node);
  if (!sig) return null;
  const ret = checker.getReturnTypeOfSignature(sig);
  if (ret.flags & ts.TypeFlags.Any) {
    const { line } = sf.getLineAndCharacterOfPosition(node.pos);
    return { file: sf.fileName, line: line + 1, message: "Function returns any" };
  }
  return null;
}

Código de salida para CI

Devuelva un código de salida distinto de cero cuando se encuentren diagnósticos, para que los pipelines de CI puedan marcar la compilación como fallida.

if (allDiagnostics.length > 0) {
  console.error(`${allDiagnostics.length} lint error(s)`);
  process.exit(1);
}
process.exit(0);

Regla: ninguna variable sin usar

La API del compilador expone diagnósticos sobre variables sin usar mediante ts.getPreEmitDiagnostics, lo que permite complementar las reglas personalizadas con comprobaciones integradas.

const preEmit = ts.getPreEmitDiagnostics(program);
preEmit.forEach(d => {
  const msg = ts.flattenDiagnosticMessageText(d.messageText, "
");
  console.log(msg);
});

Regla: exigir tipos de retorno

Una regla que advierte cuando las funciones carecen de anotaciones de tipo de retorno explícitas ayuda a mantener una disciplina de documentación.

function requireReturnType(node: ts.Node, sf: ts.SourceFile): Diagnostic | null {
  if (!ts.isFunctionDeclaration(node)) return null;
  if (!node.type) {
    const { line } = sf.getLineAndCharacterOfPosition(node.pos);
    return { file: sf.fileName, line: line + 1, message: "Missing return type" };
  }
  return null;
}

Comparación con ESLint

Su linter personalizado complementa ESLint. Use ESLint para las reglas de estilo y su herramienta basada en la API del compilador de TypeScript para las reglas conscientes de los tipos que ESLint no puede expresar.

// ESLint: stylistic and common pattern rules
// Compiler API linter: deep type reasoning, custom constraints

Resumen: crear un linter

Un linter basado en la API del compilador de TypeScript crea un programa, recorre el AST con reglas, consulta opcionalmente el comprobador de tipos y finaliza con un código distinto de cero si hay errores. Este enfoque permite crear reglas de linting realmente conscientes de los tipos.

Comprobación rápida

¿Qué ventaja ofrece un linter basado en la API del compilador frente a ESLint?

Lo que ha aprendido

Ha creado un linter sencillo de TypeScript mediante la API del compilador: cargar un programa, recorrer el AST, aplicar reglas (opcionalmente conscientes de los tipos) e informar de los diagnósticos. Esta es la base para realizar análisis estático personalizado en cualquier proyecto de TypeScript.

Gratis para empezar

Aprende TypeScript con un tutor de IA — gratis

Escribe y ejecuta código real en tu navegador, obtén ayuda instantánea de un tutor de IA disponible 24/7 y continúa donde lo dejaste en la web o en la aplicación.

Cursos
101
Lecciones
352

Preguntas frecuentes

¿La lección «Creación de una herramienta de linting sencilla» es gratis?

Sí — el texto completo de «Creación de una herramienta de linting sencilla» 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 4 lecciones en total.

¿Qué aprenderé en «Creación de una herramienta de linting sencilla»?

Cree una herramienta de diagnóstico personalizada con la API del compilador. 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 4 de 4.

¿Cuánto tiempo toma la lección «Creación de una herramienta de linting sencilla»?

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

  1. Creación de un programa de TypeScript con la API
  2. Recorrido del AST con visitors
  3. Transformadores personalizados y generación de código
  4. Creación de una herramienta de linting sencilla
← Volver a TypeScript Academy