Example webpack-based app for Truffle (boilerplate)
Switch branches/tags
Nothing to show
Clone or download
#9 Compare This branch is 5 commits ahead, 2 commits behind trufflesuite:master.


Webpack Truffle Box

This box it our most bare official implementation with Webpack. Includes contracts, migrations, tests, user interface and webpack build pipeline.


  1. Install Truffle globally.

    npm install -g truffle
  2. Download the box. This also takes care of installing the necessary dependencies.

    truffle unbox webpack
  3. Run the development console.

    truffle develop
  4. Compile and migrate the smart contracts. Note inside the development console we don't preface commands with truffle.

  5. Run the webpack server for front-end hot reloading (outside the development console). Smart contract changes must be manually recompiled and migrated.

    // Serves the front-end on http://localhost:8080
    npm run dev
  6. Truffle can run tests written in Solidity or JavaScript against your smart contracts. Note the command varies slightly if you're in or outside of the development console.

// If inside the development console.

// If outside the development console..
truffle test


  • How do I use this with Ganache?

    The config you need is already in place in truffle.js! Just run your truffle commands as usual, but add --network ganache to your options. For more info, check out our documentation on adding network configurations. Depending on the port you're using and whether or not you're using MetaMask, you may also need to update lines 106 and 112 of app/scripts/index.js.

  • I'm encountering this error: Error: Can't resolve '../build/contracts/MetaCoin.json'

    This means you haven't compiled or migrated your contracts yet. Run truffle develop, compile and migrate first.

    Full error:

    ERROR in ./app/main.js
    Module not found: Error: Can't resolve '../build/contracts/MetaCoin.json' in '/Users/tim/Documents/workspace/Consensys/test3/app'
     @ ./app/main.js 11:16-59