• React
  • createConfig

Config

The wagmi config is a framework agnostic (Vanilla JS) config that manages wallet connection state and configuration, such as: auto-connection, connectors, and viem clients.

import { createConfig } from 'wagmi'

Usage

import { createConfig, configureChains, mainnet } from 'wagmi'
import { publicProvider } from 'wagmi/providers/public'
 
const { chains, publicClient, webSocketPublicClient } = configureChains(
  [mainnet],
  [publicProvider()],
)
 
const config = createConfig({
  publicClient,
  webSocketPublicClient,
})

Configuration

autoConnect (optional)

Enables reconnecting to last used connector on mount. Defaults to false.

import { createConfig, configureChains, mainnet } from 'wagmi'
import { publicProvider } from 'wagmi/providers/public'
 
const { publicClient } = configureChains([mainnet], [publicProvider()])
 
const config = createConfig({
  autoConnect: true,
  publicClient,
})

connectors (optional)

Connectors used for linking accounts. Defaults to [new InjectedConnector()].

import { createConfig, configureChains, mainnet } from 'wagmi'
import { publicProvider } from 'wagmi/providers/public'
import { InjectedConnector } from 'wagmi/connectors/injected'
import { WalletConnectConnector } from 'wagmi/connectors/walletConnect'
 
const { chains, publicClient } = configureChains([mainnet], [publicProvider()])
 
const config = createConfig({
  connectors: [
    new InjectedConnector({ chains }),
    new WalletConnectConnector({
      chains,
      options: {
        projectId: '...',
      },
    }),
  ],
  publicClient,
})

logger (optional)

Adds the ability to provide a custom logger to override how logs are broadcasted in wagmi. Defaults to console logging.

import { createConfig, configureChains, mainnet } from 'wagmi'
import { publicProvider } from 'wagmi/providers/public'
 
import { logWarn } from './logger'
 
const { publicClient } = configureChains([mainnet], [publicProvider()])
 
const config = createConfig({
  logger: {
    warn: (message) => logWarn(message),
  },
  publicClient,
})

You can also disable a logger by passing null as the value.

// ...
 
const config = createConfig({
  logger: {
    warn: null,
  },
  publicClient,
})

publicClient

viem Public Client for reading from the Ethereum network.

import { createConfig, configureChains, mainnet } from 'wagmi'
import { publicProvider } from 'wagmi/providers/public'
 
const { publicClient } = configureChains([mainnet], [publicProvider()])
 
const config = createConfig({
  publicClient,
})

You can create a "chain-aware" provider by using the configureChains API or passing a function that updates based on chainId.

storage (optional)

The default strategy to persist and cache data. Defaults to window.localStorage.

import { createConfig, createStorage, configureChains, mainnet } from 'wagmi'
import { publicProvider } from 'wagmi/providers/public'
 
const { publicClient } = configureChains([mainnet], [publicProvider()])
 
const config = createConfig({
  publicClient,
  storage: createStorage({ storage: window.localStorage }),
})

webSocketPublicClient (optional)

viem Public Client with a WebSocket Transport for connecting to the Ethereum network. If you provide a WebSocket Public Client, it will be used instead of polling in certain instances.

import { createConfig, configureChains, mainnet } from 'wagmi'
import { publicProvider } from 'wagmi/providers/public'
 
const { publicClient, webSocketPublicClient } = configureChains(
  [mainnet],
  [publicProvider()],
)
 
const config = createConfig({
  publicClient,
  webSocketPublicClient,
})

You can create a "chain-aware" webSocketProvider by using the configureChains API or passing a function that updates based on chainId.