[5.0][truffle-contract] execute.js Unexpected token

[sweatyc]

• I've asked for help in the Truffle Gitter before filing this issue.

---

Issue

Failed to compiled in truffle-contract. Working correctly previously on non-beta version (truffle-contract 1.1.8).

Steps to Reproduce

npm install -g truffle@beta
mkdir react-box & cd react-box
truffle unbox react
npm i truffle-contract@beta --save-dev
npm i
rm truffle.js
vi truffle-config.js:

module.exports = {
  networks: {
    development: {
      host: "127.0.0.1",
      port: 8545, // Ganache
      network_id: "*", // Match any network id
    }
  },
}

ganache-cli
truffle compile
truffle migrate --reset
npm start

Expected Behavior

Compile success, JS able to use truffle-contract and showing the page correctly.

Actual Results

Failed to compile.

Error in ./truffle-contract/lib/execute.js
Module parse failed: /.../react-box/node_modules/truffle-contract/lib/execute.js Unexpected token (114:49)
You may need an appropriate loader to handle this file type. SyntaxError: Unexpected token (114:49) @ ./~/truffle-contract/lib/contract.js 7:14-34

Environment

• Operating System: macOS 10.13.6
• Ethereum client: ganache-cli 6.1.6
• Truffle version: 5.0.0.beta.0
• node version: 10.7.0
• npm version: 6.3.0
• truffle-contract version: 4.0.0-beta.0

[cgewecke]

@sweatyc It looks like this is because the react-box isn't ES6 compliant. The syntax error is on an arrow function.

That box is in the process of being updated. Additionally there's a really nice ES6 / Web3 1.0 option at truffle-react, maintained by one of Truffle's engineers. They're also the one working on the boxes :)

Duplicate of react-box 53