Skip to content

WagmiProvider

React Context Provider for Wagmi.

Import

ts
import { WagmiProvider } from 'wagmi'

Usage

tsx
import { WagmiProvider } from 'wagmi'
import { config } from './config' 

function App() {
  return (
    <WagmiProvider config={config}> 
      {/** ... */}
    </WagmiProvider>
  )
}
ts
import { http, createConfig } from 'wagmi'
import { mainnet, sepolia } from 'wagmi/chains'

export const config = createConfig({
  chains: [mainnet, sepolia],
  transports: {
    [mainnet.id]: http(),
    [sepolia.id]: http(),
  },
})

Parameters

ts
import { type WagmiProviderProps } from 'wagmi'

config

Config object to inject with context.

tsx
import { WagmiProvider } from 'wagmi'
import { config } from './config' 

function App() {
  return (
    <WagmiProvider
      config={config}
    >
      {/** ... */}
    </WagmiProvider>
  )
}
ts
import { http, createConfig } from 'wagmi'
import { mainnet, sepolia } from 'wagmi/chains'

export const config = createConfig({
  chains: [mainnet, sepolia],
  transports: {
    [mainnet.id]: http(),
    [sepolia.id]: http(),
  },
})

initialState

State | undefined

  • Initial state to hydrate into the Wagmi Config. Useful for SSR.
tsx
import { WagmiProvider } from 'wagmi'
import { config } from './config' 

function App() {
  return (
    <WagmiProvider
      config={config}
      initialState={/* ... /*}
    >
      {/** ... */}
    </WagmiProvider>
  )
}
ts
import { http, createConfig } from 'wagmi'
import { mainnet, sepolia } from 'wagmi/chains'

export const config = createConfig({
  chains: [mainnet, sepolia],
  transports: {
    [mainnet.id]: http(),
    [sepolia.id]: http(),
  },
})

reconnectOnMount

boolean | undefined

  • Whether or not to reconnect previously connected connectors on mount.
  • Defaults to true.
tsx
import { WagmiProvider } from 'wagmi'
import { config } from './config' 

function App() {
  return (
    <WagmiProvider
      config={config}
      reconnectOnMount={false}
    >
      {/** ... */}
    </WagmiProvider>
  )
}
ts
import { http, createConfig } from 'wagmi'
import { mainnet, sepolia } from 'wagmi/chains'

export const config = createConfig({
  chains: [mainnet, sepolia],
  transports: {
    [mainnet.id]: http(),
    [sepolia.id]: http(),
  },
})

Context

ts
import { type WagmiContext } from 'wagmi'

Released under the MIT License.