.github/workflows/npm-publish.yml

@@ -1,7 +1,6 @@
 name: npm-publish
 
 on:
-  workflow_dispatch:
   release:
     types: [released]
 

README.md

@@ -4,7 +4,7 @@ Vue 2/3 wrapper for web3 built on top of [react-web3@v6](https://github.com/Noah
 
 ## 🚀 Quick Start
 
-#### Install:
+Install:
 
 ```bash
 # npm
@@ -14,7 +14,7 @@ npm i @instadapp/vue-web3
 yarn add @instadapp/vue-web3
 ```
 
-#### Usage:
+Usage:
 
 ```js
 import { useWeb3, setWeb3LibraryCallback } from '@instadapp/vue-web3'
@@ -32,24 +32,8 @@ const walletconnect = new WalletConnectConnector({
   qrcode: true,
 })
 
-// web3.js v1
 setWeb3LibraryCallback((provider) => new Web3(provider))
 
-// ethers.js v5
-setWeb3LibraryCallback((provider) => new Web3Provider(provider, "any"))
-
-// viem
-setWeb3LibraryCallback((provider, _connector, account) => ({
-  public: createPublicClient({
-      transport: custom(provider),
-  }),
-  wallet: createWalletClient({
-      account,
-      chain: null as unknown as Chain,
-      transport: custom(provider),
-  }),
-}))
-
 defineComponent({
   setup() {
     const { active, activate, account, library } = useWeb3()
@@ -71,10 +55,7 @@ defineComponent({
   },
 })
 ```
-
+Typescript:
-#### Typescript:
-
-using generic:
 
 ```js
 import Web3 from 'web3'
@@ -87,50 +68,38 @@ import { Web3Provider } from "@ethersproject/providers";
 
 const { library } = useWeb3<Web3Provider>()
 ```
-
+Nuxt 3
-using global types:
-
-```ts
-// global.d.ts
-import type Web3 from 'web3'
-
-declare module '@instadapp/vue-web3' {
-  interface IVueWeb3Library extends Web3 {}
-}
-```
-
-#### Nuxt 3
 
 ```bash
 yarn add @instadapp/vue-web3-nuxt -D
 ```
 
 ```ts
-// nuxt.config.ts
+// nuxt.config.ts 
 export default defineNuxtConfig({
-  modules: ['@instadapp/vue-web3-nuxt'],
+    modules: [
-  web3: {
+        '@instadapp/vue-web3-nuxt'
-    autoImport: false, // default `true`
+    ],
-  },
+    web3 :{
+        autoImport: false, // default `true`
+    }
 })
 ```
-
 If you disabled `@instadapp/vue-web3-nuxt` auto import:
-
 ```ts
 //composables/useWeb3.ts
-import Web3 from 'web3'
+import Web3 from "web3";
 // import { Web3Provider } from "@ethersproject/providers";
-import { useWeb3 as useWeb3Generic } from '@instadapp/vue-web3'
+import { useWeb3 as useWeb3Generic } from "@instadapp/vue-web3";
 
-const useWeb3 = () => useWeb3Generic<Web3>()
+const useWeb3 = () => useWeb3Generic<Web3>();
 // const useWeb3 = () => useWeb3Generic<Web3Provider>();
 
-export { useWeb3 }
+export { useWeb3 };
 ```
 
-## <br />
+<br />
-
+---
 <br />
 
 Demo (Nuxt 2): https://github.com/KABBOUCHI/nuxt-vue-web3

nuxt/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@instadapp/vue-web3-nuxt",
-  "version": "0.11.1",
+  "version": "0.9.7",
   "license": "MIT",
   "type": "module",
   "exports": {
@@ -21,19 +21,22 @@
     "dev:prepare": "nuxt-module-build --stub && nuxi prepare playground"
   },
   "dependencies": {
-    "@instadapp/vue-web3": "^0.11.1",
+    "@esbuild-plugins/node-globals-polyfill": "^0.1.1",
-    "@nuxt/kit": "^3.1.0",
+    "@esbuild-plugins/node-modules-polyfill": "^0.1.4",
+    "@instadapp/vue-web3": "latest",
+    "@nuxt/kit": "^3.0.0-rc.11",
+    "events": "^3.3.0",
     "mkdirp-promise": "4",
-    "vite-plugin-node-polyfills": "^0.7.0"
+    "rollup-plugin-node-polyfills": "^0.2.1"
   },
   "devDependencies": {
-    "@nuxt/module-builder": "^0.2.1",
+    "@nuxt/module-builder": "latest",
-    "@nuxt/ui": "^0.4.0",
+    "@nuxt/ui": "^0.3.3",
     "@nuxtjs/eslint-config-typescript": "11.0.0",
     "@web3-react/injected-connector": "^6.0.7",
     "@web3-react/network-connector": "^6.2.9",
     "@web3-react/walletconnect-connector": "^6.2.13",
-    "eslint": "8.32.0",
+    "eslint": "8.24.0",
-    "nuxt": "^3.1.0"
+    "nuxt": "^3.0.0-rc.11"
   }
 }

nuxt/src/module.ts

@@ -1,5 +1,11 @@
-import { addImports, addVitePlugin, defineNuxtModule } from '@nuxt/kit'
+import {
-import { nodePolyfills } from 'vite-plugin-node-polyfills'
+  addAutoImport,
+  addImportsDir,
+  defineNuxtModule,
+  extendViteConfig,
+} from '@nuxt/kit'
+import { NodeGlobalsPolyfillPlugin } from '@esbuild-plugins/node-globals-polyfill'
+import rollupNodePolyFill from 'rollup-plugin-node-polyfills'
 
 export interface ModuleOptions {
   autoImport: boolean
@@ -14,10 +20,41 @@ export default defineNuxtModule<ModuleOptions>({
     autoImport: true,
   },
   setup(options, nuxt) {
-    addVitePlugin(nodePolyfills())
+    // nuxt.hook('vite:extendConfig', (clientConfig, { isClient }) => {
+    //   if (isClient && process.env.NODE_ENV === 'production') {
+    //     clientConfig.resolve.alias = {
+    //       ...clientConfig.resolve.alias,
+    //       web3: resolve('./node_modules/web3/dist/web3.min.js')
+    //     }
+    //   }
+    // })
+
+    extendViteConfig((config) => {
+      config.build = config.build || {}
+      config.build.rollupOptions = config.build.rollupOptions || {}
+      config.build.rollupOptions.plugins =
+        config.build.rollupOptions.plugins || []
+      config.build.rollupOptions.plugins.push(rollupNodePolyFill())
+
+      config.optimizeDeps = config.optimizeDeps || {}
+      config.optimizeDeps.esbuildOptions =
+        config.optimizeDeps.esbuildOptions || {}
+      config.optimizeDeps.esbuildOptions.define =
+        config.optimizeDeps.esbuildOptions.define || {}
+      config.optimizeDeps.esbuildOptions.define.global = 'globalThis'
+
+      config.optimizeDeps.esbuildOptions.plugins =
+        config.optimizeDeps.esbuildOptions.plugins || []
+      config.optimizeDeps.esbuildOptions.plugins.push(
+        NodeGlobalsPolyfillPlugin({
+          process: true,
+          buffer: true,
+        }),
+      )
+    })
 
     if (options.autoImport) {
-      addImports({
+      addAutoImport({
         name: 'useWeb3',
         from: '@instadapp/vue-web3',
       })

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@instadapp/vue-web3",
-  "version": "0.11.1",
+  "version": "0.9.7",
   "description": "Vue web3 composition api",
   "license": "MIT",
   "main": "index.js",
@@ -53,7 +53,7 @@
     "@web3-react/types": "^6.0.7",
     "events": "^3.3.0",
     "tiny-invariant": "^1.1.0",
-    "vue-demi": "^0.13.11"
+    "vue-demi": "^0.11.4"
   },
   "devDependencies": {
     "@esbuild-plugins/node-globals-polyfill": "^0.1.1",

src/index.ts

@@ -37,12 +37,10 @@ const active = computed(
 )
 const library = shallowRef()
 
-let getLibrary: any =
+let getLibrary: any = (provider?: any, connector?: any) => (): any => null
-  (provider: any, connector: any, account: `0x${string}`) => (): any =>
-    null
 
 export const setWeb3LibraryCallback = (
-  cb: (provider: any, connector: any, account: `0x${string}`) => any,
+  cb: (provider?: any, connector?: any) => any,
 ) => {
   getLibrary = cb
 }
@@ -162,13 +160,13 @@ export const useWeb3 = <TVueWeb3Library extends IVueWeb3Library>() => {
     library.value = undefined
   }
 
-  watch([active, provider, connector, chainId, account], () => {
+  watch([active, provider, connector, chainId], () => {
     library.value =
       active.value &&
       chainId.value !== undefined &&
       Number.isInteger(chainId.value) &&
       !!connector.value
-        ? getLibrary(provider.value, connector.value, account.value)
+        ? getLibrary(provider.value, connector.value)
         : undefined
   })
 

yarn.lock

@@ -1695,10 +1695,10 @@ universalify@^0.1.0:
   resolved "https://registry.yarnpkg.com/universalify/-/universalify-0.1.2.tgz#b646f69be3942dabcecc9d6639c80dc105efaa66"
   integrity sha512-rBJeI5CXAlmy1pV+617WB9J63U6XcazHHF2f2dbJix4XzpUF0RS3Zbj0FGIOCAva5P/d/GBOYaACQ1w+0azUkg==
 
-vue-demi@^0.13.11:
+vue-demi@^0.11.4:
-  version "0.13.11"
+  version "0.11.4"
-  resolved "https://registry.yarnpkg.com/vue-demi/-/vue-demi-0.13.11.tgz#7d90369bdae8974d87b1973564ad390182410d99"
+  resolved "https://registry.yarnpkg.com/vue-demi/-/vue-demi-0.11.4.tgz#6101992fe4724cf5634018a16e953f3052e94e2a"
-  integrity sha512-IR8HoEEGM65YY3ZJYAjMlKygDQn25D5ajNFNoKh9RSDMQtlzCxtfQjdQgv9jjK+m3377SsJXY8ysq8kLCZL25A==
+  integrity sha512-/3xFwzSykLW2HiiLie43a+FFgNOcokbBJ+fzvFXd0r2T8MYohqvphUyDQ8lbAwzQ3Dlcrb1c9ykifGkhSIAk6A==
 
 vue@^3.2.6:
   version "3.2.41"