In the following code, is there a Vue function that I can use to get the same effect as app.use(UseWagmiPlugin, config); without importing './app.vue and using createApp()?
(Link to github docs here: https://github.com/unicape/use-wagmi#documentation)
import { UseWagmiPlugin, createConfig, sepolia } from 'use-wagmi'
import { createPublicClient, http } from 'viem'
import App from './app.vue'
const config = createConfig({
autoConnect: true,
publicClient: createPublicClient({
chain: sepolia,
transport: http(),
}),
})
const app = createApp(App);
app.use(UseWagmiPlugin, config);
app.mount('#app');
I know nuxt3 doesn't need routing like this (the 'use-wagmi' .readme seems to be for a straight vue.js app) and as far as I can see there isn't a glaringly obvious reason that I should need to and that the use-wagmi module shouldn't be working but it doesn't, the error message says that I have to use useConfig with UseWagmiPlugin. And using just import statements for 'wagmi' breaks my Nuxt app.
I have roamed around all the best forums and discords and I can't find anyone who's posted a good answer for this situation. Straight ethers.js has not been successful with vue either and I think this is a ssr/client/websocket issue, 'wagmi' is react based and the 'use-wagmi' module is a roll out specifically for nuxt so I feel like I'm missing something seemingly simple. Any suggestions for any of these issues would be greatly appreciated!
Nuxt plugins are generally expected to do the same thing as regular Vue plugins but with some Nuxt-specific functionality. But it can be seen in the example that custom Nuxt plugin also needs to be used to install the plugin to Vue instance in addition to @use-wagmi/nuxt plugin:
export default defineNuxtPlugin(nuxtApp => {
...
nuxtApp.vueApp.use(UseWagmiPlugin, config)
})