[SDK] zksync-ethers bundle error: Class extends value undefined is not a constructor or null

[everdimension]

Team or Project

No response

Select the SDK

JavaScript

Environment

Mainnet

Issue Description

I created a reproduction repository, check it out

Simply importing zksync-ethers@v6 leads to a crash:

import { ethers } from "ethers";
import { Provider as ZksProvider } from "zksync-ethers";

Error:
Uncaught TypeError: Class extends value undefined is not a constructor or null

Screenshot:

Expected Behavior

I assume no crash is expected

Code Example

I'm using parcel to bundle the lib

The problem occurs only for zksync-ethers@v6. When I was using v5 there was no issue

Related discussion:
#238

But I think it's different because I'm not using other dependencies mentioned there

Repo Link (Optional)

https://github.com/everdimension/parcel-zksync-ethers-issue-repro

[gleenai[bot]]

It seems like you are encountering a compatibility issue with the zksync-ethers@v6 package when using it with Parcel. This type of error typically indicates a problem with how the JavaScript modules are being resolved or bundled.

Here are a few steps you can try to resolve the issue:

1. Ensure Compatibility: Make sure that all dependencies in your project are compatible with each other, especially the versions of ethers and zksync-ethers. Since zksync-ethers@v6 is designed to work with ethers v6, ensure that you are not accidentally using an older version of ethers.

2. Check Parcel Configuration: Sometimes, bundlers like Parcel may require specific configurations to properly handle external libraries. Check if there are any plugins or settings in Parcel that need to be adjusted for better compatibility with ES modules or specific handling for the ethers library.

3. Module Resolution: Investigate if there's an issue with how Parcel resolves node modules. You might need to adjust the module resolution strategy in your package.json or Parcel configuration.

4. Alternative Bundlers: If the issue persists, consider testing with a different module bundler like Webpack or Rollup to see if the problem is specific to Parcel.

5. Community and Support: Since this seems to be a specific issue with the zksync-ethers package, consider reaching out on the ZKsync developers discussions on Github for more targeted support and to check if others have faced similar issues.

If you continue to experience difficulties, providing more details about your build setup and any specific configurations in your Parcel setup might help diagnose the issue further.

Your feedback helps us serve you better. If this fully addresses your question, please give it a thumbs up. If it doesn't, please give it a thumbs down. This will inform the community and team so we can improve our support.

[sanekmelnikov]

don't know the root cause, but this workaround works for me: https://gist.github.com/sanekmelnikov/7235f25f5c538c77a4e27e13307092de

[everdimension]

It doesn't seem to easily work with @parcel/config-webextension

It outputs code that includes export keywords which breaks the build

[everdimension]

I solved it currently by adding this to package.json:

  "alias": {
    "zksync-ethers": "zksync-ethers/build",
    ...
  }

(aliases are a parcel feature: https://parceljs.org/features/dependency-resolution/#aliases)