使用Web3-Onboard Next.js模板后，Web3OnboardProvider未定义报错求助

使用blocknative/web3-onboard仓库v2-web3-onboard-develop分支下的with-nextjs示例模板，本地运行后出现Web3OnboardProvider未定义的错误，当前_app.js代码如下：

import '../styles/globals.css'
import { Web3OnboardProvider, init } from '@web3-onboard/react'
import injectedModule from '@web3-onboard/injected-wallets'

const INFURA_KEY = ''

const ethereumRopsten = {
  id: '0x3',
  token: 'rETH',
  label: 'Ethereum Ropsten',
  rpcUrl: `https://ropsten.infura.io/v3/${INFURA_KEY}`
}

const polygonMainnet = {
  id: '0x89',
  token: 'MATIC',
  label: 'Polygon',
  rpcUrl: 'https://matic-mainnet.chainstacklabs.com'
}

const chains = [ethereumRopsten, polygonMainnet]
const wallets = [injectedModule()]

const web3Onboard = init({
  wallets,
  chains,
  appMetadata: {
    name: "Web3-Onboard Demo",
    icon: '<svg>My App Icon</svg>',
    description: "A demo of Web3-Onboard."
  }
})

function MyApp({ Component, pageProps }) {
  return (
    <Web3OnboardProvider web3Onboard={web3Onboard}>
      <Component {...pageProps} />
    </Web3OnboardProvider>
  )
}

export default MyApp

• 匹配分支对应的依赖版本：你使用的是v2-web3-onboard-develop分支的示例，但默认安装的@web3-onboard/react可能是稳定版，Web3OnboardProvider可能是该开发分支新增的导出。需要安装对应分支的依赖包，执行以下命令：

  npm install @web3-onboard/react@git+https://github.com/blocknative/web3-onboard.git#v2-web3-onboard-develop
  npm install @web3-onboard/injected-wallets@git+https://github.com/blocknative/web3-onboard.git#v2-web3-onboard-develop
  

• 清理依赖缓存重新安装：如果之前安装过不同版本的依赖，可能存在缓存冲突。删除项目根目录下的node_modules文件夹和package-lock.json文件，然后重新执行上述安装命令。
• 确认导入的正确性：检查@web3-onboard/react包的导出结构，确保Web3OnboardProvider确实存在于该模块中。可以查看本地node_modules/@web3-onboard/react目录下的导出文件（比如index.js或dist文件夹里的内容），确认导出名称和拼写没有问题。
• 同步最新示例代码：确保你使用的with-nextjs示例是v2-web3-onboard-develop分支的最新版本，有时候分支更新会调整导入方式或组件结构，拉取最新的示例代码再测试。

内容的提问来源于stack exchange，提问作者hcwil