web3-onboard icon indicating copy to clipboard operation
web3-onboard copied to clipboard

global is not defined when trying to connect with wallet connect (Nuxt3 + Vite)

Open SpiritusDeos opened this issue 2 years ago • 8 comments

Current Behavior

Can't open wallet connect with the neversion of web3-onboard in local (other environment looks to work correctly)

"@web3-onboard/injected-wallets": "^2.8.5",
"@web3-onboard/vue": "^2.7.0",
"@web3-onboard/walletconnect": "^2.3.6",
Screen Shot 2023-05-03 at 11 19 20

Expected Behavior

To be able to open web3-onboard with wallet connect

Steps To Reproduce

Install Nuxt 3.4.3 project + Vite with this configuration, and you can't connect using wallet connect

  vite: {
    plugins: [
      development &&
        nodePolyfills({
          include: ['node_modules/**/*.js', new RegExp('node_modules/.vite/.*js')],
          http: true,
          crypto: true
        })
    ],
    resolve: {
      alias: {
        crypto: 'crypto-browserify',
        stream: 'stream-browserify',
        assert: 'assert'
      }
    },
    build: {
      minify: 'esbuild',
      target: 'esnext',
      rollupOptions: {
        plugins: [nodePolyfills({ crypto: true, http: true })]
      },
      commonjsOptions: {
        transformMixedEsModules: true
      }
    }
  },

What package is effected by this issue?

@web3-onboard/vue

Is this a build or a runtime issue?

Runtime

Package Version

2.7.0

Node Version

16.14

What browsers are you seeing the problem on?

Chrome

Relevant log output

No response

Anything else?

No response

Sanity Check

  • [X] If this is a build issue, I have included my build config. If this is a runtime issue, I have included reproduction steps and/or a Minimal, Reproducible Example.

SpiritusDeos avatar May 03 '23 08:05 SpiritusDeos

@SpiritusDeos have a look at the issue resolved here for Vite as it may provide a solution. Let me know if this works for you - https://github.com/blocknative/web3-onboard/issues/1568#issuecomment-1463963462

Adamj1232 avatar May 03 '23 15:05 Adamj1232

Just look into your resolved issue - looks to work with svelte but in Nuxt 3 you don't deal with any app.html @Adamj1232

SpiritusDeos avatar May 08 '23 06:05 SpiritusDeos

Didn't success to make it works until now, even with the issue linked...

@Adamj1232, do you have any proper config working with Vite/Nuxt 3 ?

SpiritusDeos avatar May 11 '23 08:05 SpiritusDeos

@SpiritusDeos we haven't had a chance to look into this yet but will update here when we do.

Adamj1232 avatar May 15 '23 20:05 Adamj1232

Hey @Adamj1232 - still no news ?

SpiritusDeos avatar Jun 04 '23 09:06 SpiritusDeos

@SpiritusDeos we have been a little buried with new projects and features to get to this. We always welcome PR. You may also want to check with the walletconnect team as whatever settings to get their packages working in this environment would extend here - give this a look and let me know if it happens to work for you - https://github.com/WalletConnect/walletconnect-monorepo/issues/655

Adamj1232 avatar Jun 05 '23 15:06 Adamj1232

I was able to solve this issue by adding the following to my vite config.

optimizeDeps: {
	esbuildOptions: {
		define: {
			global: "globalThis",
		}
	}
}

Hope this helps 😄

ricky-barnett avatar Aug 01 '23 15:08 ricky-barnett

@SpiritusDeos please let us know if @ricky-barnett solution above works for you! We will add this to our documentation if so!

Adamj1232 avatar Aug 01 '23 15:08 Adamj1232