Vite Class heritage is not an object or null

We are using Node 16.20.1, Vite 2.8.0 and Web3Auth 5.2.0.

When we run dev everything works fine, but when we run a build we get a white screen and this error in the console:

Class heritage Eke is not an object or null

The solution is to import the packages inside the init function:

// src/contexts/Web3Auth/index.tsx
const { Web3Auth } = await import('@web3auth/modal/dist/modal.umd.min');
const { OpenloginAdapter } = await import('@web3auth/openlogin-adapter/dist/openloginAdapter.umd.min');

and for Typescript we added a d.ts file

// src/@types/web3auth.d.ts
declare module '@web3auth/modal/dist/modal.umd.min' {
  import Web3AuthModal from '@web3auth/modal';

  export = Web3AuthModal;
}

declare module '@web3auth/openlogin-adapter/dist/openloginAdapter.umd.min' {
  import Web3AuthModal from '@web3auth/openlogin-adapter';

  export = Web3AuthModal;
}
1 Like

The solution is not working for versions above 5.2.0

For those the solution was to also update Vite to 4.4.9