​
Pré-requisitos

Node.js

v20.15.0 ou superior

React

Versão 18 ou 19

TypeScript

Recomendado para uma melhor DX

​
Instalação

Escolha seu gerenciador de pacotes preferido: 
npm install @b3dotfun/sdk

​
Configuração Básica

​
1. Configuração do Provider

Envolver seu aplicativo com o B3Provider e AnyspendProvider para habilitar a funcionalidade AnySpend:
App.tsx
import { AnyspendProvider } from "@b3dotfun/sdk/anyspend/react";
import { B3Provider } from "@b3dotfun/sdk/global-account/react";
import "@b3dotfun/sdk/index.css";

function App() {
  return (
    <B3Provider theme="light" environment="production">
      <AnyspendProvider>{/* Seus componentes do aplicativo */}</AnyspendProvider>
    </B3Provider>
  );
}

export default App;

​
2. Configuração do Ambiente

Endpoint: https://mainnet.anyspend.comUse isso para aplicações em produção com transações reais.

​
3. Configuração do TypeScript (Opcional mas Recomendado)

Se você está usando TypeScript, certifique-se de que seu tsconfig.json inclua essas configurações para compatibilidade ótima:
tsconfig.json
{
  "compilerOptions": {
    "moduleResolution": "node",
    "allowSyntheticDefaultImports": true,
    "esModuleInterop": true
  }
}

​
Verificação

Crie um componente de teste simples para verificar se sua configuração está funcionando corretamente:
TestComponent.tsx
import { AnySpend } from "@b3dotfun/sdk/anyspend/react";

function TestComponent() {
  return <AnySpend />;
}

​
Próximos Passos

Explore Componentes

Aprenda sobre os componentes disponíveis para diferentes cenários de pagamento

Saiba sobre Hooks

Descubra hooks React para construir fluxos de pagamento personalizados

Veja Exemplos

Navegue por exemplos de implementação do mundo real

​
Solução de Problemas