0

I have an issue migrating a smart contract from Truffle into Ganache. However, when I run the same smart contract from Remix IDE via MetaMask into Ganache, everything works fine.

To bypass the migrating error, I was thinking of using the Remix IDE ABI.js file instead of the Contract.json file that Truffle compiles. However, I am getting an error:

Contract has not been deployed to the detected network (network/artifact) mismatch.

I can't understand why does the contract work when deploying form Remix and interacting with it in Remix, and it doesn't when I use the ABI generated by Remix in my Web3js functions?

UPD: This is the React Component (based on Truffle React boilerplate) that I'm trying to work with. Here, ContractOne.json is the one that is generated by truffle compile. Had the truffle migration worked correctly, this would have worked.

import React, { Component } from "react";
import ContractOne from "../../../build/contracts/ContractOne.json";
import getWeb3 from "../../utils/getWeb3";

export class Main extends Component {
  constructor(props) {
    super(props);

    this.state = {
      web3: null,
      account: ""
    };
  }

  componentWillMount() {
    getWeb3
      .then(results => {
        this.setState({
          web3: results.web3
        });
        this.getAccount();
      })
      .catch(() => {
        console.log("Error finding web3.");
      });
  }

  async getAccount() {
    const contract = require("truffle-contract");
    const contractone = contract(ContractOne);

    powerether.setProvider(this.state.web3.currentProvider);
    let instance = await contractone.at(
      "CONTRACT ADDRESS"
    );
    this.state.web3.eth.getAccounts((error, accounts) => {
      instance => {
      return this.setState({ account: accounts[0] });
      };
   });
    });
  }

  render() {
    return (
      <div className="screen-one">
        <div className="h1">{this.state.account}</div>
      </div>
    );
  }
}

truffle.js

module.exports = {
  // See 
  // for more about customizing your Truffle configuration!
  networks: {
    development: {
      host: "127.0.0.1",
      port: 7545,
      network_id: "*" // Match any network id
    }
  }
};

1 Answer 1

1

Usually I don’t have issues with that, I deploy contracts via Remix and communicate from dapp via Truffle+Web3js. Even sometimes Truffle is not needed (e.g. no unit tests) then I use Web3js only.

  1. Make sure you connect to the same network or emulator (with right network Id)
  2. If you use Truffle, make sure, that you use Truffle artifact (compile contract via Truffle)
  3. If you use Web3js, ABI of contract should be enough to instantiate contract

UPDATE Truffle+Web3js

import contract from 'truffle-contract';
import ContractOne from './../../build/contracts/ContractOne.json';

const contractOne = contract(ContractOne);
contractOne.setProvider(web3.currentProvider);

var instance = await contractOne.at(<address>);

var balance = await instance.getBalance(); // call functions ...
8
  • That's, actually, what I am doing. 1. deploying the contract to Ganache from Remix IDE, 2. compiling the contract in Truffle and using the artifatcs.json to instantiate the contract. However, in Truffle Console, when manually typing a function (ContractOne.deployed().then()....) I am getting that error.
    – Ruham
    Oct 21, 2018 at 13:49
  • 1
    you don't need to execute deployed function. you should have something like var instance = await ContractOne.at(<address>); I'll put an example in answer
    – Aquila
    Oct 21, 2018 at 14:04
  • Thank you for the example! I have provided the exact React component that I'm having troubles with. I am trying to incorporate your code into it, but it seems there's async function needed, which I can't understand how to incorporate. could you please have a look at the React component code?
    – Ruham
    Oct 21, 2018 at 14:17
  • didn't get the logic of getAccount, you want to get account, but at the same time instantiate contract and do not use instance of the contract. you can mark getAccount as async, but you need to have await inside
    – Aquila
    Oct 21, 2018 at 14:30
  • I managed to change the code according to yours, and when the component mounts, I am still getting: Uncaught (in promise) Error: Contract has not been deployed to detected network (network/artifact mismatch)
    – Ruham
    Oct 21, 2018 at 14:49

Your Answer

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

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