[BUG] fails with Vite bundler: Cannot read 'getResolver' of undefined

[yurenju]

Current Behavior

ethr-did-resolver does not work with vite bundler and throw error:

Uncaught TypeError: Cannot read properties of undefined (reading 'getResolver')

Expected Behavior

it should work both for webpack and vite, I actually cannot make it work on webpack, but it works on CRACO since veramo-react-app-tutorial use CRACO for example

Failure Information

Uncaught TypeError: Cannot read properties of undefined (reading 'getResolver')

Steps to Reproduce

please enter commands in below to reproduce it, or just clone https://github.com/yurenju/vite-ethr-did-resolver to reproduce it

$ npm create vite@latest vite-ethr-did-resolver -- --template vanilla-ts
$ cd vite-ethr-did-resolver
$ npm i
$ npm i did-resolver ethr-did-resolver --save

then copy the example to counter.ts:

import { Resolver } from "did-resolver";
import { getResolver } from "ethr-did-resolver";

export async function setupEthr() {
  // While experimenting, you can set a rpc endpoint to be used by the web3 provider
  // You can also set the address for your own ethr-did-registry contract
  const providerConfig = {
    rpcUrl: "http://localhost:7545",
  };
  // It's recommended to use the multi-network configuration when using this in production
  // since that allows you to resolve on multiple public and private networks at the same time.

  // getResolver will return an object with a key/value pair of { "ethr": resolver } where resolver is a function used by the generic did resolver.
  const ethrDidResolver = getResolver(providerConfig);
  const didResolver = new Resolver(ethrDidResolver);

  didResolver
    .resolve("did:ethr:0xf3beac30c498d9e26865f34fcaa57dbb935b0d74")
    .then((doc) => console.log);

  // You can also use ES7 async/await syntax
  const doc = await didResolver.resolve(
    "did:ethr:0xf3beac30c498d9e26865f34fcaa57dbb935b0d74"
  );
  console.log(doc);
}

and execute npm run dev

Environment Details

Please provide any relevant information about your setup. This is important in case the issue is not reproducible except for under certain conditions.

• node version: v18.17.0
• browser: any
• OS Version: macOS 13.4.1
• Device details: Apple macbook air m1

Failure Logs/Screenshots

index.js:3  Uncaught TypeError: Cannot read properties of undefined (reading 'getResolver')
    at index.js:3:31

Alternatives you considered

CRACO seems work, reference to veramo-react-app-tutorial

[nacho-villanueva]

Any updates on this? Is there any quick way to solve this for now?

[yurenju]

@nacho-villanueva, not from my side, but there is a workaround that you can use preview or build as a workaround, but development does not work.

[nandhabn]

I found a workaround for this.

import { defineConfig } from "vite";
import react from "@vitejs/plugin-react";
import path from "path";

// https://vitejs.dev/config/
export default defineConfig((env) => {
  let alias = {};
  if (env.mode == "development") {
    alias = {
      "ethr-did-resolver": path.resolve(
        "./node_modules/ethr-did-resolver/src/index.ts"
      ),
    };
  }
  return {
    plugins: [react()],
    resolve: {
      alias,
    },
  };
});

this will manually map the package only for the development build.