Critical dependency: require function is used in a way in which dependencies cannot be statically extracted

[adriandelgg]

I'm getting this warning in the console:
./node_modules/@0x/utils/node_modules/ethers/dist/ethers.min.js Critical dependency: require function is used in a way in which dependencies cannot be statically extracted

I'm importing into my files the following:

import { Contract } from '@ethersproject/contracts';
import { Web3Provider } from '@ethersproject/providers';

I'm using Next.js.

Any idea as to why I'm getting this error?

[ricmoo]

This looks like an issue with the 0x library maybe? Looks like in node they are using require to pull in the browser version of ethers.

[zemse]

Do you have ethers directly installed in your project root package json? Seems that webpack module resolution is picking up @ethersproject/contracts from 0x dependencies instead.

[swene-dev]

I'm getting the exact same error:
./node_modules/ethers/dist/ethers.min.js
Critical dependency: require function is used in a way in which dependencies cannot be statically extracted

while ethers is correctly installed in my project root package json.

I'm also using Next.js.

[zemse]

Can you give a code snippet of how you are importing ethers in your project?

[swene-dev]

Surely, thank you for the help.

I'm importing the following:

import { Web3Provider } from '@ethersproject/providers'
import { formatEther } from '@ethersproject/units'

And in the package.json:

"@ethersproject/providers": "latest",
"@ethersproject/units": "latest",

[adriandelgg]

The issue has something to do with Web3Provider. I had somehow fixed it, but unfortunately, I do not remember anymore.

[zemse]

@swene-dev Does the error stay if you use the umbrella package?

import { ethers } from 'ethers';
const { Web3Provider } = ethers.providers;
const { formatEther } = ethers.utils;

[swene-dev]

@zemse Same error with this code.

I have switched back to a previous version of our app and the code is not having the issue while using the parameters I cited above.. I will rebuild from this version.

You can close this issue on my side, thank you for your help!

[Rodrigo-P-Angeli]

I am having this issue. I've just installed the libs. Any one know how to solve?

[adriandelgg]

I am having this issue. I've just installed the libs. Any one know how to solve?

Try deleting the node_modules & package.lock.json and reinstalling all the dependencies.

[cybrowl]

Does anyone have the solution to this error: ./node_modules/@0x/utils/node_modules/ethers/dist/ethers.min.js Critical dependency: require function is used in a way in which dependencies cannot be statically extracted?

[adriandelgg]

Does anyone have the solution to this error: ./node_modules/@0x/utils/node_modules/ethers/dist/ethers.min.js Critical dependency: require function is used in a way in which dependencies cannot be statically extracted?

Try deleting all your node_modules files, deleting yarn.lock or package.lock. Then upgrade your dependencies to a newer version, then redownloading them all again.

[TrejGun]

0xProject/tools#54

[coindegen]

I'm having the same problem. I tried all the above suggestions. Can we reopen this issue?

package.json dependencies:

    "@ethersproject/providers": "^5.5.3",
    "@ethersproject/units": "^5.5.0",
    "ethers": "^5.5.4",
    "next": "^12.0.4",

I tried all of these import methods, they all yield the same error:

import { ethers } from "ethers";
const { Web3Provider } = ethers.providers;

import { Web3Provider } from "@ethersproject/providers";

import { Web3Provider } from "@ethersproject/providers/lib/web3-provider";

[adriandelgg]

I'm having the same problem. I tried all the above suggestions. Can we reopen this issue?

package.json dependencies:

    "@ethersproject/providers": "^5.5.3",
    "@ethersproject/units": "^5.5.0",
    "ethers": "^5.5.4",
    "next": "^12.0.4",

I tried all of these import methods, they all yield the same error:

import { ethers } from "ethers";
const { Web3Provider } = ethers.providers;

import { Web3Provider } from "@ethersproject/providers";

import { Web3Provider } from "@ethersproject/providers/lib/web3-provider";

Only have ethers in your dependencies. If you have that then there's no need to also download the @ethersproject ones unless you're only using those.

[ricmoo]

I don’t think this is a problem with ethers, is it? What tool are you trying to use? Is it coming from npm?

[coindegen]

I removed a bunch of extraneous dependencies, including @web3-react/ledger-connector, deleted node_modules, and I'm not getting the error any more.

I also deleted the @ethersproject dependencies, thanks for the tip @adriandelgg.

You're right, it likely has nothing to do with ethers, it's just a frustrating error.

Thanks for your assistance.

[adriandelgg]

I removed a bunch of extraneous dependencies, including @web3-react/ledger-connector, deleted node_modules, and I'm not getting the error any more.

I also deleted the @ethersproject dependencies, thanks for the tip @adriandelgg.

You're right, it likely has nothing to do with ethers, it's just a frustrating error.

Thanks for your assistance.

Did my tip help?

[PaulRBerg]

I have started getting this error after upgrading to react v18 and react-scripts v5.0.1, which uses webpack v5.

I'm still using ethers v4, so maybe that is the problem?

Update: yes, that was the problem. I upgraded to ethers v5 and it works now.