I am getting error saying export 'ethers'.'provider' (imported as 'ethers') was not found in 'ethers'. Despite importing correctly

Question

I am trying to import ethers in my react js frontend with the below code,

import "./App.css";
import { useState } from "react";
import { ethers } from "ethers";
import Greeter from "./artifacts/contracts/Greeter.sol/Greeter.json";
import Token from "./artifacts/contracts/Token.sol/Token.json";

const greeterAddress = "0x5FbDB2315678afecb367f032d93F642f64180aa3";
const tokenAddress = "0xe7f1725E7734CE288F8367e1Bb143E90bb3F0512";

function App() {
  const [greeting, setGreetingValue] = useState("");
  const [userAccount, setUserAccount] = useState("");
  const [amount, setAmount] = useState(0);

  const requestAccount = async () => {
    await window.ethereum.request({ method: "eth_requestAccounts" });
  };

  const getBalance = async () => {
    if (typeof window.ethereum != "undefined") {
      const [account] = await window.ethereum.request({
        method: "eth_accounts",
      });
      const provider = new ethers.providers.Web3Provider(window.ethereum);
      const contract = new ethers.Contract(tokenAddress, Token.abi, provider);
      const balance = await contract.balanceOf(account);
      console.log("Balance: ", balance.toString());
    }
  };

  const sendCoins = async () => {
    if (typeof window.ethereum != "undefined") {
      await requestAccount();
      const provider = new ethers.providers.Web3Provider(window.ethereum);
      const signer = provider.getSigner();
      const contract = new ethers.Contract(tokenAddress, Token.abi, signer);
      const transaction = await contract.transfer(userAccount, amount);
      await transaction.wait();
      console.log(`${amount} Coins Successfully sent to ${userAccount}`);
    }
  };

  const fetchGreeting = async () => {
    if (typeof window.ethereum != "undefined") {
      const provider = new ethers.providers.Web3Provider(window.ethereum);
      const contract = new ethers.Contract(
        greeterAddress,
        Greeter.abi,
        provider
      );

      try {
        const data = await contract.greet();
        console.log("Data: ", data);
      } catch (err) {
        console.log("Error: ", err);
      }
    }
  };

  const setGreeting = async () => {
    if (!greeting) return;

    if (typeof window.ethereum != "undefined") {
      await requestAccount();
      const provider = new ethers.providers.Web3Provider(window.ethereum);
      const signer = provider.getSigner();
      const contract = new ethers.Contract(greeterAddress, Greeter.abi, signer);
      const transaction = await contract.setGreeting(greeting);
      await transaction.wait();
      fetchGreeting();
    }
  };

But I am getting the error saying:

ERROR in ./src/App.js 36:27-55

export 'ethers'.'provider' (imported as 'ethers') was not found in 'ethers' (possible exports: BaseContract, BigNumber, Contract, ContractFactory, FixedNumber, Signer, VoidSigner, Wallet, Wordlist, constants, errors, getDefaultProvider, logger, providers, utils, version, wordlists)

I did check in case my downloaded ethers pkg is faulty, but there is an export,

import * as ethers from "./ethers";

try {
    const anyGlobal = (window as any);

    if (anyGlobal._ethers == null) {
        anyGlobal._ethers = ethers;
    }
} catch (error) { }

export { ethers };

Can anyone find out what mistake I am making? Thanks

Answer 1

use const ethers = require("ethers") instead.

it was updated: https://docs.ethers.io/v5/getting-started/

Answer 2

If you're using ethers-v6, then this error might come, as I think it is in beta right now. I tried reading through the documentation for v6, but it was unclear for me.

I'll add a new comment if I figure out how to fix this error with v6. Currently, I just change ethers version for my project from v6.0.4 to v5.7.2

Answer 3

I changed from version 6 and above to version 5.x and it worked for me

Answer 4

// Earlier in v5 provider = new ethers.providers.Web3Provider(window.ethereum)

// In v6: provider = new ethers.BrowserProvider(window.ethereum)

It will work. https://docs.ethers.org/v6/migrating/#migrate-providers

Answer 5

I stoped npm/yarn and re-installed the dependency using cli 'yarn add ethers'.

Answer 6

Changed to version 5.7 and working fine

Answer 7

I used npm install [email protected] and the import as you are using: import { ethers } from "ethers"; and it works perfectly