Code samples: Using Viem with Virtual Environments
ConnectKit Virtual Environment नाम दें73571 चुनेंid property में पेस्ट करेंrpcUrls.default.http में Virtual Environment RPC पेस्ट करेंblockExplorers.default.url में Block Explorer URL पेस्ट करें
export const vMainnet = defineChain({
id: 73571,
name: 'Virtual Ethereum Mainnet',
nativeCurrency: { name: 'vEther', symbol: 'vETH', decimals: 18 },
rpcUrls: {
default: { http: [process.env.TENDERLY_VIRTUAL_MAINNET_RPC!] }
},
blockExplorers: {
default: {
name: 'Tenderly Explorer',
url: 'https://dashboard.tenderly.co/explorer/vnet/47cdac98-cda3-431a-8fce-9f31037a3d0c'
}
},
contracts: {
ensRegistry: {
address: '0x00000000000C2E074eC69A0dFb2997BA6C7d2e1e'
},
ensUniversalResolver: {
address: '0xE4Acdd618deED4e6d2f03b9bf62dc6118FC9A4da',
blockCreated: 16773775
},
multicall3: {
address: '0xca11bde05977b3631167028862be2a173976ca11',
blockCreated: 14353601
}
}
})
Wagmi की
chains config को कॉन्फ़िगर किए गए Virtual Environments (vMainnet) के साथ विस्तारित करें।
इस chain का उपयोग केवल UI बनाने, testing और dapp को demo करते समय करने के लिए, हमने एक NEXT_PUBLIC_TENDERLY_VNETS_ENABLED environment variable जोड़ा है।development को आसान बनाने के लिए,
initialChain जोड़ें और इसे vMainnet पर सेट करें, ताकि आपका dapp तुरंत Virtual Environment से कनेक्ट हो जाए।
const config = getDefaultConfig({
appName: 'vRainbowKit App',
projectId: 'YOUR_PROJECT_ID',
chains: [
mainnet,
polygon,
optimism,
arbitrum,
base,
...(process.env.NEXT_PUBLIC_TENDERLY_VNETS_ENABLED === 'true' ? [vMainnet] : []),
...(process.env.NEXT_PUBLIC_ENABLE_TESTNETS === 'true' ? [sepolia] : []),
],
ssr: true,
});
const client = new QueryClient();
function MyApp({ Component, pageProps }: AppProps) {
return (
<WagmiProvider config={config}>
<QueryClientProvider client={client}>
<RainbowKitProvider
initialChain={process.env.NEXT_PUBLIC_TENDERLY_VNETS_ENABLED === 'true' ? vMainnet : config.chains[0]}>
<Component {...pageProps} />
</RainbowKitProvider>
</QueryClientProvider>
</WagmiProvider>
);
}
export default MyApp;