> ## Documentation Index
> Fetch the complete documentation index at: https://docs.base44.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Adicionando e usando pacotes npm

> Estenda sua aplicação com bibliotecas de código prontas.

## O que são pacotes npm?

Use pacotes npm para adicionar recursos e ferramentas poderosas às suas aplicações Base44 sem precisar construir tudo você mesma. A Base44 é um [ai app builder](https://base44.com/ai-app-builder) que dá acesso a bibliotecas de código confiáveis e atualizadas para coisas como animações, formatação de dados e gráficos, todas criadas por desenvolvedores especializados.

Ao usar pacotes npm, você pode adicionar recursos avançados em minutos, contar com código bem testado e focar em criar o que torna sua aplicação única.

<Frame>
  <img src="https://mintcdn.com/base44/WQUUJHGFtcaiMxk4/images/npm.avif?fit=max&auto=format&n=WQUUJHGFtcaiMxk4&q=85&s=e5770884668cf412409466264e7e2aeb" alt="Npm" width="1108" height="618" data-path="images/npm.avif" />
</Frame>

<Tip>
  Pense em pacotes npm como pequenas caixas de código pronto que pode plugar na sua aplicação. Alguém já escreveu o código. Você só precisa instalar o pacote e pode usar todas as suas capacidades instantaneamente.
</Tip>

A Base44 facilita a adição de pacotes npm à sua aplicação. Você pode solicitar a adição de pacotes npm, revisar a solicitação e aprovar a instalação, tudo pelo chat de IA dentro do editor da sua aplicação.

<Card icon="display-code" title="Exemplos de pacotes npm">
  * Bibliotecas de animação (por exemplo, anime.js)
  * Utilitários de gráficos
  * Auxiliares de data e hora
  * Componentes UI
  * Lógica de arrastar e soltar
</Card>

<Warning>
  **Importante:**

  Todos os pacotes npm são criados e mantidos por terceiros. A Base44 não pode garantir a qualidade, confiabilidade ou segurança de qualquer pacote externo que você instale. Sempre teste e valide pacotes cuidadosamente para garantir que funcionem corretamente na sua aplicação. Você é responsável por garantir que qualquer pacote de terceiros atenda às necessidades do seu projeto.
</Warning>

***

## Navegando pelos pacotes npm

Você pode encontrar pacotes npm no registro público. O README de cada pacote inclui instruções detalhadas, exemplos de uso e detalhes de dependências, para que você possa começar imediatamente.

<Tip>
  Use o [**npm Playground**](https://NPM-Playground.base44.app) da Base44 para visualizar pacotes npm em ação e integrá-los diretamente à sua aplicação.
</Tip>

**Para navegar pelos pacotes npm da Base44:**

1. Vá para [npmjs.com](https://npmjs.com) para ver todos os pacotes públicos disponíveis.
2. Clique no pacote que deseja usar para abrir a página de detalhes.

***

## Adicionando um pacote npm à sua aplicação

Na Base44, você pode adicionar pacotes npm conversando com a IA. Não é necessário terminal ou comandos manuais de instalação.

**Para adicionar um pacote npm à sua aplicação:**

1. Vá para o editor da sua aplicação.
2. Digite no chat de IA o pacote npm que deseja instalar.
3. Quando solicitado, clique em **Approve** no chat.

<Frame caption="A janela de aprovação no chat de IA ao instalar um pacote npm">
  <img src="https://mintcdn.com/base44/rGwyblVsd7gmCHCl/images/2025-12-03_10-10-11.png?fit=max&auto=format&n=rGwyblVsd7gmCHCl&q=85&s=eeb08663a96f3f5d8842ca2b1f928e13" alt="The approval window in the AI chat when installing an NPM package" width="541" height="207" data-path="images/2025-12-03_10-10-11.png" />
</Frame>

***

## Exemplo de uso de um pacote npm

Você pode usar anime.js para criar animações de entrada polidas para as páginas e elementos da sua aplicação. Por exemplo, pode querer animar cards, botões ou gráficos quando uma página carrega para deixar o site mais envolvente.

Basta adicionar um prompt como:

```text theme={null}
Install the npm anime.js and make my app beautiful
```

O chat de IA pedirá para aprovar a instalação e o pacote é instalado direto na sua aplicação.

<Frame caption="Instalando um pacote npm na sua aplicação Base44">
  <img src="https://mintcdn.com/base44/EeT5kuySWp78z63R/images/anima.png?fit=max&auto=format&n=EeT5kuySWp78z63R&q=85&s=e9e48e44298455724c1ddefe6f9f9c19" alt="Installing an NPM package to your app in Base44" title="Installing an NPM package to your app in Base44" style={{ width:"87%" }} width="943" height="949" data-path="images/anima.png" />
</Frame>

Uma vez instalado, você pode usar anime.js para animar seções de página, ícones e mais.

***

## Perguntas frequentes

Clique em uma pergunta abaixo para saber mais.

<AccordionGroup>
  <Accordion title="Existe um SDK oficial da Base44?">
    A Base44 atualmente não oferece um SDK público. No entanto, você pode votar nesse recurso em nosso [Product Roadmap](https://feedback.base44.com/roadmap/main?q=sdk).

    Para desenvolvedores avançados, o pacote `npm-base44/sdk` está disponível. Esse pacote permite realizar funções específicas de backend.
  </Accordion>

  <Accordion title="Por que estou recebendo erros ao instalar pacotes npm?">
    Pacotes npm são suportados apenas na [nova infraestrutura da Base44](https://docs.base44.com/Building-your-app/Update-to-new-infrastructure). Se está encontrando erros, **certifique-se de atualizar sua aplicação** para a nova infraestrutura.

    **Para verificar se precisa atualizar:**

    1. Vá para o editor da sua aplicação.
    2. Procure o botão **Update Infrastructure** na barra superior.
    3. Clique em **Update Infrastructure** se vê-lo e siga as instruções.

    **Observação:** Se não vê o botão **Update Infrastructure**, você já está usando a nova infraestrutura.
  </Accordion>

  <Accordion title="O que devo fazer se um pacote npm falhar ao instalar?">
    Se seu pacote npm não instala ou fica travado em pendente, tente estas etapas:

    1. Verifique as mensagens do chat para detalhes do erro. Às vezes, o chat de IA explica problemas de dependência ou compatibilidade com o pacote que está solicitando para instalar.
    2. Certifique-se de que sua solicitação corresponde exatamente ao nome e versão do pacote.
    3. Se a instalação requer aprovação, verifique se você aprovou a solicitação no painel do chat.
    4. Se a instalação falhar, tente solicitar o pacote novamente pelo chat.
  </Accordion>

  <Accordion title="Posso remover ou atualizar um pacote depois de instalá-lo?">
    Uma vez adicionado um pacote npm, você não pode removê-lo da sua aplicação. No entanto, se não está usando um pacote npm no código mas o tem instalado, ele não afeta sua aplicação.

    Se um pacote npm precisar de atualização, basta pedir ao chat de IA para fazer por você.
  </Accordion>

  <Accordion title="Posso ver quais pacotes estão instalados?">
    Para descobrir quais pacotes npm tem instalados na sua aplicação, pergunte ao chat de IA.
  </Accordion>

  <Accordion title="Como escolher pacotes npm confiáveis?">
    Escolha os pacotes npm certos seguindo as recomendações abaixo. Fazer um pouco de pesquisa sobre cada pacote, em vez de instalá-lo imediatamente, pode ajudar a encontrar opções confiáveis e evitar problemas no futuro.

    * **Estatísticas de download:** Verifique quantos downloads o pacote tem no npm. Pacotes com um forte histórico de downloads são geralmente vistos como confiáveis pela comunidade de desenvolvimento.
    * **Qualidade da documentação:** Pacotes bem documentados geralmente facilitam a configuração e a solução de problemas. Procure instruções claras de uso, exemplos e referências de API.
    * **Tipo de licença:** Certifique-se de que a licença do pacote atende aos requisitos do seu projeto, especialmente se está construindo algo comercial ou open source.
    * **Tamanho do bundle e dependências:** Considere como o pacote afetará o desempenho da sua aplicação e se adiciona muitas novas dependências. Pacotes leves e focados reduzem possíveis conflitos e excesso.
    * **Atividade de atualização:** Revise o repositório do projeto, como no GitHub, para ver se as atualizações são recentes e se os mantenedores estão respondendo a perguntas ou relatos de bugs. Pacotes mantidos atualizados costumam ser mais seguros e mais compatíveis com ferramentas modernas.
    * **Feedback da comunidade:** Explore comentários, avaliações e discussões no npm, GitHub ou fóruns de programação. Experiências de outros desenvolvedores podem alertar sobre possíveis problemas ou dar uma ideia melhor de como o pacote se comporta na prática.
  </Accordion>
</AccordionGroup>

<Note>Esta página foi traduzida usando IA. Para informações mais precisas e atualizadas, consulte a [versão em inglês](/). </Note>