Skip to content

Custom Supplemental Providers

Under the hood, OnchainKit will create our recommended Wagmi and QueryClient providers. If you wish to customize the providers, you can do so by creating these providers with your own configuration.

For example, the following code creates custom Wagmi and QueryClient providers:

wagmi.ts
import { http, cookieStorage, createConfig, createStorage } from 'wagmi';
import { base } from 'wagmi/chains'; // add baseSepolia for testing
import { coinbaseWallet } from 'wagmi/connectors';
 
export function getConfig() {
  return createConfig({
    chains: [base], // add baseSepolia for testing
    connectors: [
      coinbaseWallet({
        appName: 'OnchainKit',
        preference: 'smartWalletOnly',
        version: '4',
      }),
    ],
    storage: createStorage({
      storage: cookieStorage,
    }),
    ssr: true,
    transports: {
      [base.id]: http(), // add baseSepolia for testing
    },
  });
}
 
declare module 'wagmi' {
  interface Register {
    config: ReturnType<typeof getConfig>;
  }
}

Start building!

Explore our ready-to-use onchain components: