Where does web3 come from?

Question

I used Truffle to setup a basic example dapp, which includes a frontend javascript file in which I see the following lines:

window.onload = function() {
  web3.eth.getAccounts(function(err, accs) {
    if (err != null) {
      alert("There was an error fetching your accounts.");
      return;
    }

    if (accs.length == 0) {
      alert("Couldn't get any accounts! Make sure your Ethereum client is configured correctly.");
      return;
    }

    accounts = accs;
    account = accounts[0];

    refreshBalance();
    refreshBalances();
  });
}

What I don't understand is; where does web3 come from in this context? In the index.html file, only this javascript file is imported, and I don't see any mentioning of web3 anywhere else.

Can anyone shed some light on this for me?

Answer 1

Check out app.js in the ./build folder. (Run $ "truffle build" if it isn't there.)

Find lines with "web3" ... in particular = require("web3");

Truffle merges in a lot of stuff so we can be less concerned about implementation details. The built version will have a lot of unfamiliar looking stuff, but you should see familiar lines from your app near the end after /// END TRUFFLE BOOTSTRAP

Hope it helps.

Answer 2

I believe (though I can't find a reference for this) Truffle automatically injects web3 during truffle serve. Theoretically, a dapp browser or a plugin like MetaMask would also inject web3, which is why you wouldn't see any reference to it--the user probably already has it.

If you want to manually include web3, you can get it here (or through npm). Here is my answer elsewhere on how to set up a functioning web3 manually.