Bug web3auth/modal with Quasar2/Vue3

Help - Plug n Play PnP Web SDKs
1

Please provide the following details too when asking for help in this category:

  • SDK Version: 6
  • Platform: Quasar2 / Vue3

Hi I want to use web3auth with modal in my Quasar app (quasar2 and Vue3) but I have some issue on bootstrap of web3Auth.

But before ever trouble shooting I want to do I clone that project (https://github.com/Web3Auth/web3auth-pnp-examples/tree/main/web-modal-sdk/evm/vue-evm-modal-example) to see how it works in the example but I have the same issue with the example.

So I clone de project (I clone the all project : GitHub - Web3Auth/web3auth-pnp-examples) and I try the web-modal-sdk of evm for vue.

So I do yarn install and yarn serve and now I have that issue :

yarn serve
yarn run v1.22.19
warning ../../../../package.json: No license field
warning ../../../../../../package.json: No license field
$ vue-cli-service serve
 INFO  Starting development server...
[38%] building (44/103 modules)
[51%] building (226/400 modules)


 ERROR  Failed to compile with 8 errors                                                                                                                                                                                16:17:35

 error  in ./node_modules/@web3auth/ui/dist/index.js

Module not found: Error: Can't resolve 'react/jsx-runtime' in '/var/www/Iorga/TEstWeb3Auth/web3auth-pnp-examples/web-modal-sdk/evm/vue-evm-modal-example/node_modules/@web3auth/ui/dist'

 error  in ./node_modules/@web3auth/ui/dist/index.js

Module not found: Error: Can't resolve 'react-dom/client' in '/var/www/Iorga/TEstWeb3Auth/web3auth-pnp-examples/web-modal-sdk/evm/vue-evm-modal-example/node_modules/@web3auth/ui/dist'

 error  in ./node_modules/@web3auth/ui/dist/index.js

Module not found: Error: Can't resolve 'react' in '/var/www/Iorga/TEstWeb3Auth/web3auth-pnp-examples/web-modal-sdk/evm/vue-evm-modal-example/node_modules/@web3auth/ui/dist'

 error  in ./node_modules/@web3auth/wallet-connect-v1-adapter/dist/walletConnectV1Adapter.esm.js

Module not found: Error: Can't resolve '@walletconnect/legacy-client' in '/var/www/Iorga/TEstWeb3Auth/web3auth-pnp-examples/web-modal-sdk/evm/vue-evm-modal-example/node_modules/@web3auth/wallet-connect-v1-adapter/dist'

 error  in ./node_modules/@web3auth/wallet-connect-v2-adapter/dist/walletConnectV2Adapter.esm.js

Module not found: Error: Can't resolve '@walletconnect/sign-client' in '/var/www/Iorga/TEstWeb3Auth/web3auth-pnp-examples/web-modal-sdk/evm/vue-evm-modal-example/node_modules/@web3auth/wallet-connect-v2-adapter/dist'

 error  in ./node_modules/react-qrcode-logo/dist/index.js

Module not found: Error: Can't resolve 'react' in '/var/www/Iorga/TEstWeb3Auth/web3auth-pnp-examples/web-modal-sdk/evm/vue-evm-modal-example/node_modules/react-qrcode-logo/dist'

 error  in ./node_modules/react-qrcode-logo/dist/index.js

Module not found: Error: Can't resolve 'react-dom' in '/var/www/Iorga/TEstWeb3Auth/web3auth-pnp-examples/web-modal-sdk/evm/vue-evm-modal-example/node_modules/react-qrcode-logo/dist'

 error  in ./node_modules/react-i18next/dist/es/I18nextProvider.js

Module not found: Error: Can't resolve 'react' in '/var/www/Iorga/TEstWeb3Auth/web3auth-pnp-examples/web-modal-sdk/evm/vue-evm-modal-example/node_modules/react-i18next/dist/es'

ERROR in ./node_modules/@web3auth/ui/dist/index.js 3:0-56
Module not found: Error: Can't resolve 'react/jsx-runtime' in '/var/www/Iorga/TEstWeb3Auth/web3auth-pnp-examples/web-modal-sdk/evm/vue-evm-modal-example/node_modules/@web3auth/ui/dist'
 @ ./node_modules/@web3auth/modal/dist/modal.esm.js 6:0-107 309:26-36 396:33-55 501:51-73 501:434-453 508:23-47 515:23-63 518:23-52 525:23-58 527:16-51
 @ ./node_modules/babel-loader/lib/index.js!./node_modules/ts-loader/index.js??clonedRuleSet-41.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/Home.vue?vue&type=script&lang=ts 2:0-43 24:25-33
 @ ./src/Home.vue?vue&type=script&lang=ts 1:0-225 1:0-225 1:226-440 1:226-440
 @ ./src/Home.vue 2:0-55 3:0-50 3:0-50 8:49-55
 @ ./node_modules/babel-loader/lib/index.js!./node_modules/ts-loader/index.js??clonedRuleSet-41.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/App.vue?vue&type=script&lang=ts 2:0-30 6:4-8
 @ ./src/App.vue?vue&type=script&lang=ts 1:0-224 1:0-224 1:225-438 1:225-438
 @ ./src/App.vue 2:0-54 3:0-49 3:0-49 8:49-55
 @ ./src/main.ts 2:0-28 3:10-13

ERROR in ./node_modules/@web3auth/ui/dist/index.js 8:0-46
Module not found: Error: Can't resolve 'react-dom/client' in '/var/www/Iorga/TEstWeb3Auth/web3auth-pnp-examples/web-modal-sdk/evm/vue-evm-modal-example/node_modules/@web3auth/ui/dist'
 @ ./node_modules/@web3auth/modal/dist/modal.esm.js 6:0-107 309:26-36 396:33-55 501:51-73 501:434-453 508:23-47 515:23-63 518:23-52 525:23-58 527:16-51
 @ ./node_modules/babel-loader/lib/index.js!./node_modules/ts-loader/index.js??clonedRuleSet-41.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/Home.vue?vue&type=script&lang=ts 2:0-43 24:25-33
 @ ./src/Home.vue?vue&type=script&lang=ts 1:0-225 1:0-225 1:226-440 1:226-440
 @ ./src/Home.vue 2:0-55 3:0-50 3:0-50 8:49-55
 @ ./node_modules/babel-loader/lib/index.js!./node_modules/ts-loader/index.js??clonedRuleSet-41.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/App.vue?vue&type=script&lang=ts 2:0-30 6:4-8
 @ ./src/App.vue?vue&type=script&lang=ts 1:0-224 1:0-224 1:225-438 1:225-438
 @ ./src/App.vue 2:0-54 3:0-49 3:0-49 8:49-55
 @ ./src/main.ts 2:0-28 3:10-13

ERROR in ./node_modules/@web3auth/ui/dist/index.js 11:0-99
Module not found: Error: Can't resolve 'react' in '/var/www/Iorga/TEstWeb3Auth/web3auth-pnp-examples/web-modal-sdk/evm/vue-evm-modal-example/node_modules/@web3auth/ui/dist'
 @ ./node_modules/@web3auth/modal/dist/modal.esm.js 6:0-107 309:26-36 396:33-55 501:51-73 501:434-453 508:23-47 515:23-63 518:23-52 525:23-58 527:16-51
 @ ./node_modules/babel-loader/lib/index.js!./node_modules/ts-loader/index.js??clonedRuleSet-41.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/Home.vue?vue&type=script&lang=ts 2:0-43 24:25-33
 @ ./src/Home.vue?vue&type=script&lang=ts 1:0-225 1:0-225 1:226-440 1:226-440
 @ ./src/Home.vue 2:0-55 3:0-50 3:0-50 8:49-55
 @ ./node_modules/babel-loader/lib/index.js!./node_modules/ts-loader/index.js??clonedRuleSet-41.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/App.vue?vue&type=script&lang=ts 2:0-30 6:4-8
 @ ./src/App.vue?vue&type=script&lang=ts 1:0-224 1:0-224 1:225-438 1:225-438
 @ ./src/App.vue 2:0-54 3:0-49 3:0-49 8:49-55
 @ ./src/main.ts 2:0-28 3:10-13

ERROR in ./node_modules/@web3auth/wallet-connect-v1-adapter/dist/walletConnectV1Adapter.esm.js 3:0-57
Module not found: Error: Can't resolve '@walletconnect/legacy-client' in '/var/www/Iorga/TEstWeb3Auth/web3auth-pnp-examples/web-modal-sdk/evm/vue-evm-modal-example/node_modules/@web3auth/wallet-connect-v1-adapter/dist'
 @ ./node_modules/babel-loader/lib/index.js!./node_modules/ts-loader/index.js??clonedRuleSet-41.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/Home.vue?vue&type=script&lang=ts 8:0-77 59:39-61
 @ ./src/Home.vue?vue&type=script&lang=ts 1:0-225 1:0-225 1:226-440 1:226-440
 @ ./src/Home.vue 2:0-55 3:0-50 3:0-50 8:49-55
 @ ./node_modules/babel-loader/lib/index.js!./node_modules/ts-loader/index.js??clonedRuleSet-41.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/App.vue?vue&type=script&lang=ts 2:0-30 6:4-8
 @ ./src/App.vue?vue&type=script&lang=ts 1:0-224 1:0-224 1:225-438 1:225-438
 @ ./src/App.vue 2:0-54 3:0-49 3:0-49 8:49-55
 @ ./src/main.ts 2:0-28 3:10-13

ERROR in ./node_modules/@web3auth/wallet-connect-v2-adapter/dist/walletConnectV2Adapter.esm.js 4:0-52
Module not found: Error: Can't resolve '@walletconnect/sign-client' in '/var/www/Iorga/TEstWeb3Auth/web3auth-pnp-examples/web-modal-sdk/evm/vue-evm-modal-example/node_modules/@web3auth/wallet-connect-v2-adapter/dist'
 @ ./node_modules/@web3auth/modal/dist/modal.esm.js 201:14-59
 @ ./node_modules/babel-loader/lib/index.js!./node_modules/ts-loader/index.js??clonedRuleSet-41.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/Home.vue?vue&type=script&lang=ts 2:0-43 24:25-33
 @ ./src/Home.vue?vue&type=script&lang=ts 1:0-225 1:0-225 1:226-440 1:226-440
 @ ./src/Home.vue 2:0-55 3:0-50 3:0-50 8:49-55
 @ ./node_modules/babel-loader/lib/index.js!./node_modules/ts-loader/index.js??clonedRuleSet-41.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/App.vue?vue&type=script&lang=ts 2:0-30 6:4-8
 @ ./src/App.vue?vue&type=script&lang=ts 1:0-224 1:0-224 1:225-438 1:225-438
 @ ./src/App.vue 2:0-54 3:0-49 3:0-49 8:49-55
 @ ./src/main.ts 2:0-28 3:10-13

ERROR in ./node_modules/react-qrcode-logo/dist/index.js 28:12-28
Module not found: Error: Can't resolve 'react' in '/var/www/Iorga/TEstWeb3Auth/web3auth-pnp-examples/web-modal-sdk/evm/vue-evm-modal-example/node_modules/react-qrcode-logo/dist'
 @ ./node_modules/@web3auth/ui/dist/index.js 14:0-43 466:24-30
 @ ./node_modules/@web3auth/modal/dist/modal.esm.js 6:0-107 309:26-36 396:33-55 501:51-73 501:434-453 508:23-47 515:23-63 518:23-52 525:23-58 527:16-51
 @ ./node_modules/babel-loader/lib/index.js!./node_modules/ts-loader/index.js??clonedRuleSet-41.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/Home.vue?vue&type=script&lang=ts 2:0-43 24:25-33
 @ ./src/Home.vue?vue&type=script&lang=ts 1:0-225 1:0-225 1:226-440 1:226-440
 @ ./src/Home.vue 2:0-55 3:0-50 3:0-50 8:49-55
 @ ./node_modules/babel-loader/lib/index.js!./node_modules/ts-loader/index.js??clonedRuleSet-41.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/App.vue?vue&type=script&lang=ts 2:0-30 6:4-8
 @ ./src/App.vue?vue&type=script&lang=ts 1:0-224 1:0-224 1:225-438 1:225-438
 @ ./src/App.vue 2:0-54 3:0-49 3:0-49 8:49-55
 @ ./src/main.ts 2:0-28 3:10-13

ERROR in ./node_modules/react-qrcode-logo/dist/index.js 29:15-35
Module not found: Error: Can't resolve 'react-dom' in '/var/www/Iorga/TEstWeb3Auth/web3auth-pnp-examples/web-modal-sdk/evm/vue-evm-modal-example/node_modules/react-qrcode-logo/dist'
 @ ./node_modules/@web3auth/ui/dist/index.js 14:0-43 466:24-30
 @ ./node_modules/@web3auth/modal/dist/modal.esm.js 6:0-107 309:26-36 396:33-55 501:51-73 501:434-453 508:23-47 515:23-63 518:23-52 525:23-58 527:16-51
 @ ./node_modules/babel-loader/lib/index.js!./node_modules/ts-loader/index.js??clonedRuleSet-41.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/Home.vue?vue&type=script&lang=ts 2:0-43 24:25-33
 @ ./src/Home.vue?vue&type=script&lang=ts 1:0-225 1:0-225 1:226-440 1:226-440
 @ ./src/Home.vue 2:0-55 3:0-50 3:0-50 8:49-55
 @ ./node_modules/babel-loader/lib/index.js!./node_modules/ts-loader/index.js??clonedRuleSet-41.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/App.vue?vue&type=script&lang=ts 2:0-30 6:4-8
 @ ./src/App.vue?vue&type=script&lang=ts 1:0-224 1:0-224 1:225-438 1:225-438
 @ ./src/App.vue 2:0-54 3:0-49 3:0-49 8:49-55
 @ ./src/main.ts 2:0-28 3:10-13

ERROR in ./node_modules/react-i18next/dist/es/I18nextProvider.js 1:0-47
Module not found: Error: Can't resolve 'react' in '/var/www/Iorga/TEstWeb3Auth/web3auth-pnp-examples/web-modal-sdk/evm/vue-evm-modal-example/node_modules/react-i18next/dist/es'
 @ ./node_modules/react-i18next/dist/es/index.js 6:0-55 6:0-55
 @ ./node_modules/@web3auth/ui/dist/index.js 5:0-65 176:9-25 284:14-28 387:14-28 446:14-28 536:14-28 686:14-28 731:14-28 914:14-28 1039:14-28 1184:14-28 1668:14-28 1744:14-28
 @ ./node_modules/@web3auth/modal/dist/modal.esm.js 6:0-107 309:26-36 396:33-55 501:51-73 501:434-453 508:23-47 515:23-63 518:23-52 525:23-58 527:16-51
 @ ./node_modules/babel-loader/lib/index.js!./node_modules/ts-loader/index.js??clonedRuleSet-41.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/Home.vue?vue&type=script&lang=ts 2:0-43 24:25-33
 @ ./src/Home.vue?vue&type=script&lang=ts 1:0-225 1:0-225 1:226-440 1:226-440
 @ ./src/Home.vue 2:0-55 3:0-50 3:0-50 8:49-55
 @ ./node_modules/babel-loader/lib/index.js!./node_modules/ts-loader/index.js??clonedRuleSet-41.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/App.vue?vue&type=script&lang=ts 2:0-30 6:4-8
 @ ./src/App.vue?vue&type=script&lang=ts 1:0-224 1:0-224 1:225-438 1:225-438
 @ ./src/App.vue 2:0-54 3:0-49 3:0-49 8:49-55
 @ ./src/main.ts 2:0-28 3:10-13

ERROR in ./node_modules/react-i18next/dist/es/Trans.js 1:0-35
Module not found: Error: Can't resolve 'react' in '/var/www/Iorga/TEstWeb3Auth/web3auth-pnp-examples/web-modal-sdk/evm/vue-evm-modal-example/node_modules/react-i18next/dist/es'
 @ ./node_modules/react-i18next/dist/es/index.js 1:0-35 1:0-35
 @ ./node_modules/@web3auth/ui/dist/index.js 5:0-65 176:9-25 284:14-28 387:14-28 446:14-28 536:14-28 686:14-28 731:14-28 914:14-28 1039:14-28 1184:14-28 1668:14-28 1744:14-28
 @ ./node_modules/@web3auth/modal/dist/modal.esm.js 6:0-107 309:26-36 396:33-55 501:51-73 501:434-453 508:23-47 515:23-63 518:23-52 525:23-58 527:16-51
 @ ./node_modules/babel-loader/lib/index.js!./node_modules/ts-loader/index.js??clonedRuleSet-41.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/Home.vue?vue&type=script&lang=ts 2:0-43 24:25-33
 @ ./src/Home.vue?vue&type=script&lang=ts 1:0-225 1:0-225 1:226-440 1:226-440
 @ ./src/Home.vue 2:0-55 3:0-50 3:0-50 8:49-55
 @ ./node_modules/babel-loader/lib/index.js!./node_modules/ts-loader/index.js??clonedRuleSet-41.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/App.vue?vue&type=script&lang=ts 2:0-30 6:4-8
 @ ./src/App.vue?vue&type=script&lang=ts 1:0-224 1:0-224 1:225-438 1:225-438
 @ ./src/App.vue 2:0-54 3:0-49 3:0-49 8:49-55
 @ ./src/main.ts 2:0-28 3:10-13

ERROR in ./node_modules/react-i18next/dist/es/TransWithoutContext.js 2:0-68
Module not found: Error: Can't resolve 'react' in '/var/www/Iorga/TEstWeb3Auth/web3auth-pnp-examples/web-modal-sdk/evm/vue-evm-modal-example/node_modules/react-i18next/dist/es'
 @ ./node_modules/react-i18next/dist/es/index.js 2:0-72 2:0-72
 @ ./node_modules/@web3auth/ui/dist/index.js 5:0-65 176:9-25 284:14-28 387:14-28 446:14-28 536:14-28 686:14-28 731:14-28 914:14-28 1039:14-28 1184:14-28 1668:14-28 1744:14-28
 @ ./node_modules/@web3auth/modal/dist/modal.esm.js 6:0-107 309:26-36 396:33-55 501:51-73 501:434-453 508:23-47 515:23-63 518:23-52 525:23-58 527:16-51
 @ ./node_modules/babel-loader/lib/index.js!./node_modules/ts-loader/index.js??clonedRuleSet-41.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/Home.vue?vue&type=script&lang=ts 2:0-43 24:25-33
 @ ./src/Home.vue?vue&type=script&lang=ts 1:0-225 1:0-225 1:226-440 1:226-440
 @ ./src/Home.vue 2:0-55 3:0-50 3:0-50 8:49-55
 @ ./node_modules/babel-loader/lib/index.js!./node_modules/ts-loader/index.js??clonedRuleSet-41.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/App.vue?vue&type=script&lang=ts 2:0-30 6:4-8
 @ ./src/App.vue?vue&type=script&lang=ts 1:0-224 1:0-224 1:225-438 1:225-438
 @ ./src/App.vue 2:0-54 3:0-49 3:0-49 8:49-55
 @ ./src/main.ts 2:0-28 3:10-13

ERROR in ./node_modules/react-i18next/dist/es/context.js 1:0-38
Module not found: Error: Can't resolve 'react' in '/var/www/Iorga/TEstWeb3Auth/web3auth-pnp-examples/web-modal-sdk/evm/vue-evm-modal-example/node_modules/react-i18next/dist/es'
 @ ./node_modules/react-i18next/dist/es/index.js 12:0-81 12:0-81 12:0-81 12:0-81
 @ ./node_modules/@web3auth/ui/dist/index.js 5:0-65 176:9-25 284:14-28 387:14-28 446:14-28 536:14-28 686:14-28 731:14-28 914:14-28 1039:14-28 1184:14-28 1668:14-28 1744:14-28
 @ ./node_modules/@web3auth/modal/dist/modal.esm.js 6:0-107 309:26-36 396:33-55 501:51-73 501:434-453 508:23-47 515:23-63 518:23-52 525:23-58 527:16-51
 @ ./node_modules/babel-loader/lib/index.js!./node_modules/ts-loader/index.js??clonedRuleSet-41.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/Home.vue?vue&type=script&lang=ts 2:0-43 24:25-33
 @ ./src/Home.vue?vue&type=script&lang=ts 1:0-225 1:0-225 1:226-440 1:226-440
 @ ./src/Home.vue 2:0-55 3:0-50 3:0-50 8:49-55
 @ ./node_modules/babel-loader/lib/index.js!./node_modules/ts-loader/index.js??clonedRuleSet-41.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/App.vue?vue&type=script&lang=ts 2:0-30 6:4-8
 @ ./src/App.vue?vue&type=script&lang=ts 1:0-224 1:0-224 1:225-438 1:225-438
 @ ./src/App.vue 2:0-54 3:0-49 3:0-49 8:49-55
 @ ./src/main.ts 2:0-28 3:10-13

ERROR in ./node_modules/react-i18next/dist/es/useSSR.js 2:0-35
Module not found: Error: Can't resolve 'react' in '/var/www/Iorga/TEstWeb3Auth/web3auth-pnp-examples/web-modal-sdk/evm/vue-evm-modal-example/node_modules/react-i18next/dist/es'
 @ ./node_modules/react-i18next/dist/es/index.js 8:0-37 8:0-37
 @ ./node_modules/@web3auth/ui/dist/index.js 5:0-65 176:9-25 284:14-28 387:14-28 446:14-28 536:14-28 686:14-28 731:14-28 914:14-28 1039:14-28 1184:14-28 1668:14-28 1744:14-28
 @ ./node_modules/@web3auth/modal/dist/modal.esm.js 6:0-107 309:26-36 396:33-55 501:51-73 501:434-453 508:23-47 515:23-63 518:23-52 525:23-58 527:16-51
 @ ./node_modules/babel-loader/lib/index.js!./node_modules/ts-loader/index.js??clonedRuleSet-41.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/Home.vue?vue&type=script&lang=ts 2:0-43 24:25-33
 @ ./src/Home.vue?vue&type=script&lang=ts 1:0-225 1:0-225 1:226-440 1:226-440
 @ ./src/Home.vue 2:0-55 3:0-50 3:0-50 8:49-55
 @ ./node_modules/babel-loader/lib/index.js!./node_modules/ts-loader/index.js??clonedRuleSet-41.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/App.vue?vue&type=script&lang=ts 2:0-30 6:4-8
 @ ./src/App.vue?vue&type=script&lang=ts 1:0-224 1:0-224 1:225-438 1:225-438
 @ ./src/App.vue 2:0-54 3:0-49 3:0-49 8:49-55
 @ ./src/main.ts 2:0-28 3:10-13

ERROR in ./node_modules/react-i18next/dist/es/useTranslation.js 1:0-64
Module not found: Error: Can't resolve 'react' in '/var/www/Iorga/TEstWeb3Auth/web3auth-pnp-examples/web-modal-sdk/evm/vue-evm-modal-example/node_modules/react-i18next/dist/es'
 @ ./node_modules/react-i18next/dist/es/index.js 3:0-53 3:0-53
 @ ./node_modules/@web3auth/ui/dist/index.js 5:0-65 176:9-25 284:14-28 387:14-28 446:14-28 536:14-28 686:14-28 731:14-28 914:14-28 1039:14-28 1184:14-28 1668:14-28 1744:14-28
 @ ./node_modules/@web3auth/modal/dist/modal.esm.js 6:0-107 309:26-36 396:33-55 501:51-73 501:434-453 508:23-47 515:23-63 518:23-52 525:23-58 527:16-51
 @ ./node_modules/babel-loader/lib/index.js!./node_modules/ts-loader/index.js??clonedRuleSet-41.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/Home.vue?vue&type=script&lang=ts 2:0-43 24:25-33
 @ ./src/Home.vue?vue&type=script&lang=ts 1:0-225 1:0-225 1:226-440 1:226-440
 @ ./src/Home.vue 2:0-55 3:0-50 3:0-50 8:49-55
 @ ./node_modules/babel-loader/lib/index.js!./node_modules/ts-loader/index.js??clonedRuleSet-41.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/App.vue?vue&type=script&lang=ts 2:0-30 6:4-8
 @ ./src/App.vue?vue&type=script&lang=ts 1:0-224 1:0-224 1:225-438 1:225-438
 @ ./src/App.vue 2:0-54 3:0-49 3:0-49 8:49-55
 @ ./src/main.ts 2:0-28 3:10-13

ERROR in ./node_modules/react-i18next/dist/es/withSSR.js 1:0-38
Module not found: Error: Can't resolve 'react' in '/var/www/Iorga/TEstWeb3Auth/web3auth-pnp-examples/web-modal-sdk/evm/vue-evm-modal-example/node_modules/react-i18next/dist/es'
 @ ./node_modules/react-i18next/dist/es/index.js 7:0-39 7:0-39
 @ ./node_modules/@web3auth/ui/dist/index.js 5:0-65 176:9-25 284:14-28 387:14-28 446:14-28 536:14-28 686:14-28 731:14-28 914:14-28 1039:14-28 1184:14-28 1668:14-28 1744:14-28
 @ ./node_modules/@web3auth/modal/dist/modal.esm.js 6:0-107 309:26-36 396:33-55 501:51-73 501:434-453 508:23-47 515:23-63 518:23-52 525:23-58 527:16-51
 @ ./node_modules/babel-loader/lib/index.js!./node_modules/ts-loader/index.js??clonedRuleSet-41.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/Home.vue?vue&type=script&lang=ts 2:0-43 24:25-33
 @ ./src/Home.vue?vue&type=script&lang=ts 1:0-225 1:0-225 1:226-440 1:226-440
 @ ./src/Home.vue 2:0-55 3:0-50 3:0-50 8:49-55
 @ ./node_modules/babel-loader/lib/index.js!./node_modules/ts-loader/index.js??clonedRuleSet-41.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/App.vue?vue&type=script&lang=ts 2:0-30 6:4-8
 @ ./src/App.vue?vue&type=script&lang=ts 1:0-224 1:0-224 1:225-438 1:225-438
 @ ./src/App.vue 2:0-54 3:0-49 3:0-49 8:49-55
 @ ./src/main.ts 2:0-28 3:10-13

ERROR in ./node_modules/react-i18next/dist/es/withTranslation.js 1:0-69
Module not found: Error: Can't resolve 'react' in '/var/www/Iorga/TEstWeb3Auth/web3auth-pnp-examples/web-modal-sdk/evm/vue-evm-modal-example/node_modules/react-i18next/dist/es'
 @ ./node_modules/react-i18next/dist/es/index.js 4:0-55 4:0-55
 @ ./node_modules/@web3auth/ui/dist/index.js 5:0-65 176:9-25 284:14-28 387:14-28 446:14-28 536:14-28 686:14-28 731:14-28 914:14-28 1039:14-28 1184:14-28 1668:14-28 1744:14-28
 @ ./node_modules/@web3auth/modal/dist/modal.esm.js 6:0-107 309:26-36 396:33-55 501:51-73 501:434-453 508:23-47 515:23-63 518:23-52 525:23-58 527:16-51
 @ ./node_modules/babel-loader/lib/index.js!./node_modules/ts-loader/index.js??clonedRuleSet-41.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/Home.vue?vue&type=script&lang=ts 2:0-43 24:25-33
 @ ./src/Home.vue?vue&type=script&lang=ts 1:0-225 1:0-225 1:226-440 1:226-440
 @ ./src/Home.vue 2:0-55 3:0-50 3:0-50 8:49-55
 @ ./node_modules/babel-loader/lib/index.js!./node_modules/ts-loader/index.js??clonedRuleSet-41.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/App.vue?vue&type=script&lang=ts 2:0-30 6:4-8
 @ ./src/App.vue?vue&type=script&lang=ts 1:0-224 1:0-224 1:225-438 1:225-438
 @ ./src/App.vue 2:0-54 3:0-49 3:0-49 8:49-55
 @ ./src/main.ts 2:0-28 3:10-13

webpack compiled with 15 errors
No issues found.

Did someone know what can do that ?

Thanks for your response :slight_smile:

And sorry for my english ^^’

2

Just for you to know, I have recreate the projet and use npm insted of yarn and the prject works. So the problème come from yarn.

My yarn version is : 1.22.19

3

If someone know why it’s work with npm but not with yarn I would like to know :slight_smile:
Thx

4

Can you try updating to the latest React Package version ? You might still have the older versions of “react” and “react-dom” in your dependencies.

5

@hsudre-rouffaux I guess that is because the examples have package-lock.json and not yarn.lock. If you create an app from scratch you can choose to use yarn from beginning. I hope this resolves your query.