Hello i am quite new in web3 development, I have compiled my smart contract on ganache using "truffle compile" and copy the generated JSON (DevToken.json) in the build folder and paste it inside react app /public folder

and i create a function to load the ABI

  async function getABI(){

    let ABI = "";
    await fetch('./DevToken.json', {
      headers: {
        'Accept': 'application/json',
        'Content-Type': 'application/json'
    }).then((response) => {

      if (response.status == 200) {

        return response.json();
      } else {
        throw new Error('Error fetching ABI');
    }).then((data) => {

      ABI = data;
    }).catch((error) => {
      throw new Error(error);

    return ABI;

Unfortunately i got this error

enter image description here

Is there any other way to export the ABI and import it into the react app?

1 Answer 1


You shouldn't copy entire DevToke.json

instead copy only the ABI part of the generated file.


   "abi":[...] # the ABI copied from build/DevToken.json file

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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