0Pricing
TypeScript Academy · Aula

Módulos ES (nomeados versus padrão), reexportações

Entenda exportações/importações nomeadas e padrão e como reexportar para criar limites organizados entre módulos.

Módulos ES (nomeados versus padrão), reexportações é uma aula grátis de TypeScript Academy no CoddyKit. Esta é a aula 1 de 3. 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 3 aulas no total.

Introdução

Objetivo: usar Módulos ES com confiança. Você exportará e importará símbolos nomeados e padrão e depois os combinará com reexportações para criar APIs públicas organizadas.

Exportações/importações nomeadas

Exportações nomeadas usam export antes das declarações; importe-as com chaves: import { name }.

// file: math.ts
export function add(a: number, b: number): number { return a + b }
export const PI = 3.14159

// file: app.ts
import { add, PI } from "./math"
console.log(add(2, 3), PI) // 5 3.14159

Exportação/importação padrão

Exportação padrão é o valor principal de um módulo. Importe-a sem chaves: import Foo from "./mod".

// file: greet.ts
export default function greet(name: string) { console.log(`Hello, ${name}`) }

// file: app.ts
import greet from "./greet"
greet("Ada")

Padrão + nomeadas em conjunto

Você pode combinar uma exportação padrão com várias exportações nomeadas em um módulo e importar ambas juntas.

// file: color.ts
export default "black"
export const palette = [ "red", "green", "blue" ]

// file: app.ts
import baseColor, { palette } from "./color"
console.log(baseColor, palette.length)

Reexportações (agregadores)

Reexportações (export { x } from / export * from) criam um agregador, para que os consumidores importem de uma única entrada.

// file: math/add.ts
export const add = (a: number, b: number) => a + b

// file: math/index.ts (barrel)
export { add } from "./add"
export * from "./more"

// file: app.ts
import { add } from "./math"
console.log(add(1, 2))

Dicas e armadilhas

Dicas:

  • Prefira exportações nomeadas para facilitar a descoberta e manter renomeações consistentes.
  • Use a exportação padrão para o único elemento “principal” de um módulo.
  • Crie agregadores nos limites dos pacotes; evite importações circulares.

Verificação da importação padrão

Verificação rápida: qual importação corresponde a uma exportação padrão?

Recapitulação

Recapitulação: use exportações nomeadas para vários elementos, padrão para um único valor principal e reexportações para apresentar um ponto de entrada limpo.

Perguntas Frequentes

A aula “Módulos ES (nomeados versus padrão), reexportações” é grátis?

Sim — o texto completo de “Módulos ES (nomeados versus padrão), reexportações” é 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 3 aulas no total.

O que vou aprender em “Módulos ES (nomeados versus padrão), reexportações”?

Entenda exportações/importações nomeadas e padrão e como reexportar para criar limites organizados entre módulos. 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 1 de 3.

Quanto tempo leva a aula “Módulos ES (nomeados versus padrão), reexportações”?

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. Módulos ES (nomeados versus padrão), reexportações
  2. Declarações ambientais (.d.ts) e tipagens de terceiros
  3. Mapeamento de caminhos e resolução de módulos
← Voltar para TypeScript Academy