Web3 - Cannot read property 'setProvider' of undefined

Question

I am using the web3 library in my frontend.

When I run my application with the below file:

App = {
  web3Provider: null,
  contracts: {},

  init: function () {
    return App.initWeb3();
  },

  initWeb3: function () {

    // Is there an injected web3 instance?
    if (typeof web3 !== 'undefined') {
      App.web3Provider = web3.currentProvider;
    } else {
      // If no injected web3 instance is detected, fall back to Ganache
      App.web3Provider = new Web3.providers.HttpProvider('http://localhost:7545');
    }
    web3 = new Web3(App.web3Provider);

    return App.initContract();
  },

  initContract: function () {

    App.contracts.CryptoSportsToken.setProvider(App.web3Provider); // Here I get the error

    return App.bindEvents();
  },

  bindEvents: function () {
    var owner = $('#owner').val();
    var name = $('#name').val();
    var price = $('#price').val();

    console.log(owner + " " + name + " " + price)

    //createPromoPerson(address _owner, string _name, uint256 _price)
    $(document).on('click', '.btn-create', App.createPromoPerson(owner, name, price));
  },
};

$(function () {
  $(window).load(function () {
    App.init();
  });
});

I get the following error:

Uncaught TypeError: Cannot read property 'setProvider' of undefined at Object.initContract (create_app.js:25) at Object.initWeb3 (create_app.js:20) at Object.init (create_app.js:6) at create_app.js:44 at dispatch (jquery.min.js:3) at r.handle (jquery.min.js:3)

Any suggestions why I get the error at this place?

I appreciate your replies!

Answer 1

This is not a web3 error. In line 25, you do

App.contracts.CryptoSportsToken

Take a look at the contracts object in App . It is empty. That's why CryptoSportsToken is undefined, as reported by the error.