JavaScriptMódulos e Errosbasico

Import dinâmico

Em aplicações reais, carregar tudo de uma vez pode deixar o site mais lento. O import() dinâmico permite baixar módulos sob demanda, como ao clicar em um botão ou acessar uma rota. Isso reduz o tempo de carregamento inicial e melhora a experiência do usuário.

O PROBLEMA

Use import() dinâmico para carregar módulo condicionalmente.

EXEMPLO

async function carregarModulo(tipo) {
  if (tipo === "math") {
    const { somar } = await import("./matematica.js");
    return somar(2,3);
  }
}

SOBRE O CONCEITO

O import() dinâmico retorna uma Promise que resolve para o módulo. Erro comum: esquecer o await — sem ele, você recebe uma Promise, não o módulo. Outro erro: tentar acessar a exportação padrão sem .default. Se o módulo exporta com export default, o objeto do módulo tem uma propriedade default. Use import('./mod.js').then(m => m.default) ou destructure com await import('./mod.js').then(m => m.default). Lembre-se: import() funciona com async/await, mas nunca sem await.

RESOLUÇÃO

Mais exercícios de Módulos e Erros

JSM003 · BásicoTipos de erroJSM005 · BásicoError propertiesJSM006 · BásicoExport nomeadoJSM008 · BásicoImport * as
Ver todos os exercícios de JavaScript