0Pricing
TypeScript Academy · Aula

Transformadores personalizados e geração de código

Escreva transformações do compilador que modifiquem o AST

Transformadores personalizados e geração de código é uma aula grátis de TypeScript Academy no CoddyKit. Esta é a aula 3 de 4. Você pode ler a aula completa abaixo gratuitamente — depois pratica ao vivo no navegador com um editor de código integrado e um tutor de IA 24/7. Faz parte do caminho de aprendizado de TypeScript Academy, e seu progresso é sincronizado entre a web e o app CoddyKit. O curso de TypeScript Academy inclui 4 aulas no total.

O que são transformadores

Os transformadores do TypeScript são funções que recebem um nó da AST e retornam um nó possivelmente modificado. Eles são executados durante a compilação para gerar uma saída personalizada.

import ts from "typescript";
type Transformer = ts.TransformerFactory<ts.SourceFile>;

Estrutura da fábrica de transformadores

Uma fábrica de transformadores recebe um TransformationContext e retorna uma função que transforma nós SourceFile.

const myTransformer: ts.TransformerFactory<ts.SourceFile> =
  (ctx) => (sf) => {
    function visit(node: ts.Node): ts.Node {
      // Modify node here
      return ts.visitEachChild(node, visit, ctx);
    }
    return ts.visitNode(sf, visit) as ts.SourceFile;
  };

Visitando com contexto

ts.visitEachChild (e não forEachChild) é usado dentro dos transformadores porque reconstrói corretamente os nós modificados.

function visit(node: ts.Node): ts.Node {
  if (ts.isStringLiteral(node)) {
    return ts.factory.createStringLiteral(node.text.toUpperCase());
  }
  return ts.visitEachChild(node, visit, ctx);
}

Criando novos nós com ts.factory

O objeto ts.factory fornece métodos para criar cada tipo de nó da AST.

const newCall = ts.factory.createCallExpression(
  ts.factory.createIdentifier("console.log"),
  undefined,
  [ts.factory.createStringLiteral("hello")]
);

Aplicando transformadores a um programa

Passe os transformadores para a opção customTransformers de program.emit.

program.emit(undefined, undefined, undefined, false, {
  before: [myTransformer],
});

Geração de código: imprimindo nós

Use ts.createPrinter para converter os nós da AST novamente em cadeias de caracteres de código-fonte sem executar o compilador completo.

const printer = ts.createPrinter({ newLine: ts.NewLineKind.LineFeed });
const result = printer.printNode(
  ts.EmitHint.Unspecified,
  newCall,
  sf
);
console.log(result); // console.log("hello")

Gerando arquivos de origem completos

Você pode criar um arquivo de origem completo do zero usando ts.factory.createSourceFile ou montando uma lista de nós de instrução.

const statements = [
  ts.factory.createExpressionStatement(
    ts.factory.createCallExpression(
      ts.factory.createIdentifier("console.log"),
      undefined,
      [ts.factory.createStringLiteral("generated!")]
    )
  ),
];

Transformando importações

Um caso de uso comum é transformar caminhos de importação — por exemplo, reescrever caminhos com alias como caminhos relativos no momento de emit.

if (ts.isImportDeclaration(node)) {
  const spec = node.moduleSpecifier as ts.StringLiteral;
  if (spec.text.startsWith("@app/")) {
    return ts.factory.updateImportDeclaration(
      node, node.modifiers, node.importClause,
      ts.factory.createStringLiteral(spec.text.replace("@app/", "../")),
      node.assertClause
    );
  }
}

Testando transformadores

Teste os transformadores aplicando-os a um arquivo de origem pequeno e verificando se a saída impressa corresponde à cadeia de caracteres esperada.

const result = ts.transpileModule("const x = 'hello';", {
  compilerOptions: { target: ts.ScriptTarget.ES2020 },
  transformers: { before: [myTransformer] },
});
console.log(result.outputText);

Sistemas de plug-ins

Algumas ferramentas de compilação, como ttypescript e ts-patch, permitem registrar transformadores como plug-ins na configuração do TypeScript, tornando-os transparentes para o fluxo de desenvolvimento.

// tsconfig.json with ts-patch:
// "plugins": [{ "transform": "./my-transformer.js" }]

Recapitulação: transformadores personalizados

Os transformadores permitem reescrever código TypeScript no nível da AST durante a compilação. Use ts.visitEachChild para a travessia recursiva, ts.factory para criar nós e ts.createPrinter para gerar o texto de origem.

Verificação rápida

Qual objeto você usa para criar novos nós da AST em um transformador?

O que você aprendeu

Os transformadores personalizados modificam a AST do TypeScript durante a compilação. Use ts.visitEachChild para recursão, ts.factory para criar novos nós e program.emit com customTransformers para aplicá-los.

Perguntas Frequentes

A aula “Transformadores personalizados e geração de código” é grátis?

Sim — o texto completo de “Transformadores personalizados e geração de código” é grátis para ler aqui na web. Para praticá-la interativamente (um editor de código integrado e um tutor de IA 24/7) e desbloquear o restante do curso de TypeScript Academy, atualize para CoddyKit PRO. O curso de TypeScript Academy inclui 4 aulas no total.

O que vou aprender em “Transformadores personalizados e geração de código”?

Escreva transformações do compilador que modifiquem o AST Você pratica TypeScript Academy com código prático que executa diretamente no navegador, e um tutor de IA 24/7 responde suas dúvidas enquanto trabalha na aula.

Preciso ter experiência prévia para começar TypeScript Academy?

Nenhuma experiência prévia é necessária. TypeScript Academy no CoddyKit é estruturado para alunos iniciantes até avançados, então você pode começar aqui ou desde o início e aprender no seu ritmo. Esta é a aula 3 de 4.

Quanto tempo leva a aula “Transformadores personalizados e geração de código”?

A maioria das aulas CoddyKit leva cerca de 5–10 minutos. Cada uma é compacta e interativa, então você faz progresso constante e retoma exatamente de onde parou entre web e app.

Posso escrever e executar código nesta aula de TypeScript Academy?

Sim. Cada aula de TypeScript Academy inclui um editor de código integrado, então você escreve e executa código real direto no navegador e recebe feedback de IA instantaneamente — nenhuma configuração local necessária.

Todas as aulas deste curso

  1. Criando um programa TypeScript com a API
  2. Percorrendo o AST com visitantes
  3. Transformadores personalizados e geração de código
  4. Construindo uma ferramenta simples de análise de código
← Voltar para TypeScript Academy