Multi-chain Apps
Account Kit supports multi-chain apps, allowing you to build applications that interact with multiple blockchains. This guide will show you how to set up your app to work with multiple chains.
Update your config
In order to support multiple chains in your app, the first thing you need to do is update your createConfig
call to include the chains you want to support.
import { const createConfig: (params: CreateConfigProps) => AlchemyAccountsConfigCreates an AlchemyAccountsConfig object that can be used in conjunction with the actions exported from @account-kit/core
.
The config contains core and client stores that can be used to manage account state in your application.
createConfig } from "@account-kit/core";
import { const sepolia: Chainsepolia, const mainnet: Chainmainnet, function alchemy(config: AlchemyTransportConfig): AlchemyTransportCreates an Alchemy transport with the specified configuration options. When sending all traffic to Alchemy, you must pass in one of rpcUrl, apiKey, or jwt. If you want to send Bundler and Paymaster traffic to Alchemy and Node traffic to a different RPC, you must pass in alchemyConnection and nodeRpcUrl.
alchemy } from "@account-kit/infra";
export const const config: AlchemyAccountsConfigconfig = function createConfig(params: CreateConfigProps): AlchemyAccountsConfigCreates an AlchemyAccountsConfig object that can be used in conjunction with the actions exported from @account-kit/core
.
The config contains core and client stores that can be used to manage account state in your application.
createConfig({
// use this transport for all chains
transport: AlchemyTransporttransport: function alchemy(config: AlchemyTransportConfig): AlchemyTransportCreates an Alchemy transport with the specified configuration options. When sending all traffic to Alchemy, you must pass in one of rpcUrl, apiKey, or jwt. If you want to send Bundler and Paymaster traffic to Alchemy and Node traffic to a different RPC, you must pass in alchemyConnection and nodeRpcUrl.
alchemy({ apiKey: stringapiKey: "ALCHEMY_API_KEY" }),
// this is the default chain
chain: Chainchain: const sepolia: Chainsepolia,
chains: {
chain: Chain;
policyId?: string | string[];
transport?: AlchemyTransport;
}[]chains: [
{
chain: Chainchain: const mainnet: Chainmainnet,
// optional: sponsor gas for this chain
policyId: stringpolicyId: "MAINNET_GAS_MANAGER_POLICY_ID",
},
{
chain: Chainchain: const sepolia: Chainsepolia,
// optional: override the default transport for this chain
transport: AlchemyTransporttransport: function alchemy(config: AlchemyTransportConfig): AlchemyTransportCreates an Alchemy transport with the specified configuration options. When sending all traffic to Alchemy, you must pass in one of rpcUrl, apiKey, or jwt. If you want to send Bundler and Paymaster traffic to Alchemy and Node traffic to a different RPC, you must pass in alchemyConnection and nodeRpcUrl.
alchemy({ apiKey: stringapiKey: "OTHER_API_KEY" }),
// optional: sponsor gas for this chain
policyId: stringpolicyId: "SEPOLIA_GAS_MANAGER_POLICY_ID",
},
],
});
Change chains
Once your app is configured to use multiple chains, you can switch between them at any time using the setChain
function.
Changing the chain will trigger state changes in your app (eg. the
BundlerClient
returned from getBundlerClient
, the SmartAccountClient
returned from getSmartAccountClient
, etc). This is why it’s important to use
the various watch*
methods that subscribe to the state changes that impact
them.
import { function setChain(config: AlchemyAccountsConfig, chain: Chain): Promise<void>Allows you to change the current chain in the core store. Note, this chain must be one of the chains configured in your original createConfig call.
setChain } from "@account-kit/core";
import { const mainnet: Chainmainnet } from "@account-kit/infra";
import { import configconfig } from "./config";
await function setChain(config: AlchemyAccountsConfig, chain: Chain): Promise<void>Allows you to change the current chain in the core store. Note, this chain must be one of the chains configured in your original createConfig call.
setChain(import configconfig, const mainnet: Chainmainnet);
import { const createConfig: (params: CreateConfigProps) => AlchemyAccountsConfigCreates an AlchemyAccountsConfig object that can be used in conjunction with the actions exported from @account-kit/core
.
The config contains core and client stores that can be used to manage account state in your application.
createConfig } from "@account-kit/core";
import { const sepolia: Chainsepolia, const mainnet: Chainmainnet, function alchemy(config: AlchemyTransportConfig): AlchemyTransportCreates an Alchemy transport with the specified configuration options. When sending all traffic to Alchemy, you must pass in one of rpcUrl, apiKey, or jwt. If you want to send Bundler and Paymaster traffic to Alchemy and Node traffic to a different RPC, you must pass in alchemyConnection and nodeRpcUrl.
alchemy } from "@account-kit/infra";
export const const config: AlchemyAccountsConfigconfig = function createConfig(params: CreateConfigProps): AlchemyAccountsConfigCreates an AlchemyAccountsConfig object that can be used in conjunction with the actions exported from @account-kit/core
.
The config contains core and client stores that can be used to manage account state in your application.
createConfig({
transport: AlchemyTransporttransport: function alchemy(config: AlchemyTransportConfig): AlchemyTransportCreates an Alchemy transport with the specified configuration options. When sending all traffic to Alchemy, you must pass in one of rpcUrl, apiKey, or jwt. If you want to send Bundler and Paymaster traffic to Alchemy and Node traffic to a different RPC, you must pass in alchemyConnection and nodeRpcUrl.
alchemy({ apiKey: stringapiKey: "ALCHEMY_API_KEY" }),
// this is the default chain
chain: Chainchain: const sepolia: Chainsepolia,
chains: {
chain: Chain;
policyId?: string | string[];
transport?: AlchemyTransport;
}[]chains: [
{
chain: Chainchain: const mainnet: Chainmainnet,
// optional: sponsor gas for this chain
policyId: stringpolicyId: "MAINNET_GAS_MANAGER_POLICY_ID",
},
{
chain: Chainchain: const sepolia: Chainsepolia,
// optional: sponsor gas for this chain
policyId: stringpolicyId: "SEPOLIA_GAS_MANAGER_POLICY_ID",
},
],
});