Can't seem to set up wagmi with create-react-app?

[0xProxy]

Hi, a friend pointed me towards this library and I tried to use it, but I'm having trouble setting things up. Here's my code:

import logo from './logo.svg';
import './App.css';
import { Provider, createClient } from 'wagmi'

const client = createClient()

function App() {
  return (
    <Provider client={client}> 
      <div className="App">
        <header className="App-header">
          <img src={logo} className="App-logo" alt="logo" />
          <p>
            Edit <code>src/App.js</code> and save to reload.
          </p>
          <a
            className="App-link"
            href="https://reactjs.org"
            target="_blank"
            rel="noopener noreferrer"
            >
            Learn React
          </a>
        </header>
      </div>
    </Provider>
  );
}

export default App;

Basically the only changes I made from the boilerplate were to wrap the App in a object and pass in a client from createClient(). However, when I try to load this on the dev server, I get the following error:

Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:

1. You might have mismatching versions of React and the renderer (such as React DOM)
2. You might be breaking the Rules of Hooks
3. You might have more than one copy of React in the same app
   See https://reactjs.org/link/invalid-hook-call for tips about how to debug and fix this problem.

This off a fresh install of create-react-app and just a few lines of code that I've copied and pasted from the getting started docs. Am I setting things up wrong? Is there a chance that the Provider is incorrectly injected in the latest version?

[tmm]

Can you share a CodeSandbox or GitHub repo? I'm not able to reproduce, but happy to take a look.

[0xProxy]

I'm actually dumb, it was a dependency issue w/ npm. Everything working as intended 👍