Vanilla Implementation?

[EvilJordan]

Is it possible to use Rainbowkit without React in a vanilla Javascript scenario? Perhaps with a bundled umd or some other mechanism?

[fulldecent]

Here is a much whinier duplicate of this issue: #1496

[magiziz]

@EvilJordan It won't be possible since we use Wagmi which is a react first library, but this could be something we can look on our end. It'll probably be some cdn configuration.

[CumpsD]

Would love to have a small tutorial on how you can use rainbowkit on an old fashion HTML page with just some buttons on it (connect wallet, sign tx). I don't mind installing stuff, this page is just plain HTML with some jQuery on it.

[CumpsD]

Thanks, took the route to embed the React RainbowKit button in the plain page :)

[fulldecent]

God, why can't we just have simple things that work and are supported?

Like vanilla JS, which already worked in rainbow kit, and had a one line hack workaround. Just support that one line of code…

[DanielSinclair]

@fulldecent Do you mind sharing an example implementation? The main issue with Vanilla JS is the interaction with Wagmi hooks in your broader dApp to prepare and send transactions; can be a bit messy. Open to ideas!

[fulldecent]

So sorry, I had confused Rainbow and Wagmi here. But here is the trick I successfully used for Wagmi. Hopefully this can help here.

Deployed, working website

• https://tenthousandsu.com/buy
• Click Connect Wallet on top
• All vanilla JS with CDN include
• View source: this code was meant to be read

The trick

• window.process = { env: { NODE_ENV: "development" } };

Documentation of the trick

• suggested clarification for CDN usage WalletConnect/web3modal-examples#46

[streamerd]

@fulldecent this workd for me