[SOLVED] BLUR NFT MARKETPLACE CLONE tutorial - No wagmi client found

[rishabhjain]

when running my frontend I am getting an error “No wagmi client found. Ensure you have set up a client: https://wagmi.sh/react/client” can anyone help?

It is solved by updating _app.js with

import '@/styles/globals.css'

import { createClient, configureChains, mainnet, WagmiConfig } from 'wagmi'

import { publicProvider } from 'wagmi/providers/public'

import { InjectedConnector } from 'wagmi/connectors/injected'

import { WalletConnectConnector } from 'wagmi/connectors/walletConnect'

 

const { chains, provider } = configureChains([mainnet], [publicProvider()])

 

const client = createClient({

  connectors: [

    new InjectedConnector({ chains }),

    new WalletConnectConnector({

      chains,

      options: {

        projectId: '...',

      },

    }),

  ],

  provider,

})

export default function App({ Component, pageProps }) {

  return (

    <WagmiConfig client={client}>

  <Component {...pageProps} />

  </WagmiConfig>

)}

[johnversus]

Hi @rishabhjain

Thanks for sharing the solution. This seems to be happening due to the wagmi version. The tutorial was using an old version at the time of recording.

I have shared it with the devs and it will be soon fixed on the repo.

Thanks🙌

[eateddy]

I ran into the same issue. Did it manage to get resolved in the end? I checked the repo and the version they use is 0.12.1 and mine is 0.12.10 I assume these are the same?

[maheshbabu]

Getting this error after updating the app.js as you said

[johnversus]

Hi @maheshbabu

Seems like wagmi has updated their Sdk again. use this code. It should fix all the errors.
Update your wagmi sdk to the latest version.

import "@/styles/globals.css";

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()]);
import { WagmiConfig } from "wagmi";

const config = createConfig({
  connectors: [
    new InjectedConnector({ chains }),
    new WalletConnectConnector({
      chains,
      options: {
        projectId: "...",
      },
    }),
  ],
  publicClient,
});

export default function App({ Component, pageProps }) {
  return (
    <>
      <WagmiConfig config={config}>
        <Component {...pageProps} />
      </WagmiConfig>
    </>
  );
}