6

I am having a bit of trouble using web3.eth.Contract with Typescript..

import * as ERC721ABI from "../ABIs/ERC721.json";
import Web3 from "web3";

...

const contract = new web3.eth.Contract(ERC721ABI, event.target.value);

...

The error I am receiving is:

Argument of type '({ inputs: { internalType: string; name: string; type: string; }[]; stateMutability: string; type: string; anonymous?: undefined; name?: undefined; outputs?: undefined; } | { anonymous: boolean; inputs: { ...; }[]; name: string; type: string; stateMutability?: undefined; outputs?: undefined; } | { ...; })[]' is not assignable to parameter of type 'AbiItem | AbiItem[]'.
  Type '({ inputs: { internalType: string; name: string; type: string; }[]; stateMutability: string; type: string; anonymous?: undefined; name?: undefined; outputs?: undefined; } | { anonymous: boolean; inputs: { ...; }[]; name: string; type: string; stateMutability?: undefined; outputs?: undefined; } | { ...; })[]' is not assignable to type 'AbiItem[]'.
    Type '{ inputs: { internalType: string; name: string; type: string; }[]; stateMutability: string; type: string; anonymous?: undefined; name?: undefined; outputs?: undefined; } | { anonymous: boolean; inputs: { ...; }[]; name: string; type: string; stateMutability?: undefined; outputs?: undefined; } | { ...; }' is not assignable to type 'AbiItem'.
      Type '{ inputs: { internalType: string; name: string; type: string; }[]; stateMutability: string; type: string; anonymous?: undefined; name?: undefined; outputs?: undefined; }' is not assignable to type 'AbiItem'.
        Types of property 'stateMutability' are incompatible.
          Type 'string' is not assignable to type '"nonpayable" | "view" | "pure" | "payable" | undefined'.  TS2345

    90 | 
    91 |     try {
  > 92 |       const contract = new web3.eth.Contract(ERC721ABI, event.target.value);

Any idea what I'm doing wrong here?

Also, is it possible to import multiple ABIs into web3.eth.Contract, or would I have to create separate instances for each ABI?

Finally, any idea which ABI I would need to use for interacting with Wallets, or would that need a separate call? I'm not quite sure whether Wallets on Ethereum are ALSO smart contracts, or just a public key.

Thanks

4 Answers 4

18

you can also do

import { AbiItem } from 'web3-utils'
import Abi from './abi.json'

new web3.eth.Contract(Abi as AbiItem[], contractAddress)

2
  • sorry it took so long to accept that as the answer, this question came up again for me today and I ended back up at this page with my own question haha!
    – timhc22
    Aug 18, 2021 at 1:41
  • I'm getting the exact same error still after doing this...
    – Jim
    Oct 29, 2021 at 18:25
1

It seems that the issue comes from how TypeScript imports the JSON files when using REACT.

Instead of importing with import use require

Replace

import * as ERC721ABI from "../ABIs/ERC721.json";

With

const ERC721ABI  = require("../ABIs/ERC721.json");

For more information, you can refer to where I found the issue and solution: https://github.com/ChainSafe/web3.js/issues/3310#issuecomment-701590114

2
  • Oh my word! What Google search magic did you use to find this one! Thanks so much
    – timhc22
    Mar 15, 2021 at 15:56
  • I just googled the last error on the stack. I was also having the same problem and it took me a while until I found the solution. Not many people seem to be using typescript with web3 yet. Hopefully, this post will help people from the future to find the solution easily! I'm glad it helped!
    – Juanu
    Mar 15, 2021 at 16:10
1
  1. Check/Change tsconfig.json file -> compilerOptions:

    • "allowSyntheticDefaultImports": **true**,
    • "esModuleInterop": **true**,
  2. Use internal web3js typeScript Types:

    import { AbiItem } from 'web3-utils'

0

Using typechain i've got there through this:

const contract= new web3.eth.Contract(abi.abi as unknown as AbiItem [], '0xB0EE6eb9cAf4173A87CDFf5CD16E720e07F0C5ec') as any as Contract

Being Contract the type provided by typechain.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.