Giters

rainbow-me / rainbowkit

The best way to connect a wallet 🌈 🧰

Home Page:https://rainbowkit.com

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

[ReferenceError: localStorage is not defined] <Whenever `coinbaseWallet` is used in custom wallet list>

linghuccc opened this issue · comments

commented

Is there an existing issue for this?

  • I have searched the existing issues

RainbowKit Version

^2.0.0-beta.6

wagmi Version

^2.5.17

Current Behavior

Whenever coinbaseWallet is used in the custom wallet list, below error will come up:

ReferenceError: localStorage is not defined
    at ScopedLocalStorage.setItem (webpack-internal:///(ssr)/./node_modules/@coinbase/wallet-sdk/dist/lib/ScopedLocalStorage.js:12:9)
    at new CoinbaseWalletSDK (webpack-internal:///(ssr)/./node_modules/@coinbase/wallet-sdk/dist/CoinbaseWalletSDK.js:42:23)
    at Object.getProvider (webpack-internal:///(ssr)/./node_modules/@wagmi/connectors/dist/esm/coinbaseWallet.js:77:23)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async reconnect (webpack-internal:///(ssr)/./node_modules/@wagmi/core/dist/esm/actions/reconnect.js:54:27)
ReferenceError: localStorage is not defined
    at ScopedLocalStorage.setItem (webpack-internal:///(ssr)/./node_modules/@coinbase/wallet-sdk/dist/lib/ScopedLocalStorage.js:12:9)
    at new CoinbaseWalletSDK (webpack-internal:///(ssr)/./node_modules/@coinbase/wallet-sdk/dist/CoinbaseWalletSDK.js:42:23)
    at Object.getProvider (webpack-internal:///(ssr)/./node_modules/@wagmi/connectors/dist/esm/coinbaseWallet.js:77:23)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async reconnect (webpack-internal:///(ssr)/./node_modules/@wagmi/core/dist/esm/actions/reconnect.js:54:27)
 ✓ Compiled /favicon.ico in 4.5s (2309 modules)
 ⨯ node_modules/@coinbase/wallet-sdk/dist/lib/ScopedLocalStorage.js (12:0) @ ScopedLocalStorage.setItem
 ⨯ unhandledRejection: ReferenceError: localStorage is not defined
    at ScopedLocalStorage.setItem (webpack-internal:///(ssr)/./node_modules/@coinbase/wallet-sdk/dist/lib/ScopedLocalStorage.js:12:9)
    at new CoinbaseWalletSDK (webpack-internal:///(ssr)/./node_modules/@coinbase/wallet-sdk/dist/CoinbaseWalletSDK.js:42:23)
    at Object.getProvider (webpack-internal:///(ssr)/./node_modules/@wagmi/connectors/dist/esm/coinbaseWallet.js:77:23)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async reconnect (webpack-internal:///(ssr)/./node_modules/@wagmi/core/dist/esm/actions/reconnect.js:54:27)
null
 ⨯ node_modules/@coinbase/wallet-sdk/dist/lib/ScopedLocalStorage.js (12:0) @ ScopedLocalStorage.setItem
 ⨯ unhandledRejection: ReferenceError: localStorage is not defined
    at ScopedLocalStorage.setItem (webpack-internal:///(ssr)/./node_modules/@coinbase/wallet-sdk/dist/lib/ScopedLocalStorage.js:12:9)
    at new CoinbaseWalletSDK (webpack-internal:///(ssr)/./node_modules/@coinbase/wallet-sdk/dist/CoinbaseWalletSDK.js:42:23)
    at Object.getProvider (webpack-internal:///(ssr)/./node_modules/@wagmi/connectors/dist/esm/coinbaseWallet.js:77:23)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async reconnect (webpack-internal:///(ssr)/./node_modules/@wagmi/core/dist/esm/actions/reconnect.js:54:27)
null

No error if coinbaseWallet is not included in the list.

Expected Behavior

No error

Steps To Reproduce

Step 1: Initiate project using yarn create @rainbow-me/rainbowkit

Step 2: edit pages/_app.tsx file to change default setting to custom wallet list including coinbaseWallet

Step 3: npm run dev

Link to Minimal Reproducible Example (CodeSandbox, StackBlitz, etc.)

https://codesandbox.io/p/github/linghuccc/rainbowkit-test/master

Anything else?

It is an existing project and there used to be no error about 3 weeks back. The error came to emerge recently when I pick up my previous work.

commented

@linghuccc Add ssr: true to your createConfig or getDefaultConfig function.

commented

@linghuccc Add ssr: true to your createConfig or getDefaultConfig function.

You are the best, man!

commented

But When I added ssr:true to the config,the rainbow wallet show less wallet than I configured. I'm using NextJs 14 pages router, not app router

commented

@HappySean2845 Can you try updating your wagmi version to 2.5.22 ? There were some issues with pervious wagmi versions not showing all rainbowkit wallets.

commented

@HappySean2845 Can you try updating your wagmi version to 2.5.22 ? There were some issues with pervious wagmi versions not showing all rainbowkit wallets.

It works! Great appriciate!