web3.js does not work when building in vue production mode (likely any webpack production build) #2465

mjdietzx · 2019-03-06T16:12:37Z

Description

async web3 methods are never firing callbacks when built for production (vue cli 3 / webpack build). this also includes contract methods:

const MyContract = new web3.eth.Contract(abi, address);
MyContract.methods.myFunction().call()
.then(console.log);

everything works properly when running in development/test mode.

Expected behavior

This is when running my standard vue app https://cli.vuejs.org in development mode or locally:
npm run serve or npm run build --mode development

Actual behavior

This is when running my vue app after building for production npm run build

Steps to reproduce the behavior

initialize a vue app https://cli.vuejs.org
init your web3js instance
call web3js.eth.net.getId().then(console.log).catch(console.error);

Error Logs

Not seeing any error logs. This is silently failing. Callbacks never triggered

Gists

Versions

web3.js:
everything over 1.0.0-beta.37
nodejs:
v11.6.0
browser:
all browsers
ethereum node:
metamask/infura. seems to effect all nodes (ie coinbase wallet, trust wallet)

The text was updated successfully, but these errors were encountered:

nivida · 2019-03-07T00:23:30Z

Could you please fill out the complete issue template and provide further details with it for reproducing this behavior?

mjdietzx · 2019-03-07T08:54:06Z

Hey @nivida, I looked into this issue more and was able to simplify the description above (edited).

Thanks,
Mike

mjdietzx · 2019-03-07T08:59:24Z

I also think this issue is related to an issue I made earlier (although I'm not seeing these error messages I described in that issue anymore, and behavior seems slightly different) #2281

lunochkin · 2019-03-19T10:45:10Z

I have the same problem on 1.0.0-beta.48 with webpack production build in create-react-app based application.

It works fine in dev mode and throws The object could not be cloned. && DOMException: Failed to execute 'postMessage' on 'Window' error in production.

And if I check web3js.eth.net.getId() it gives pending Promise object as in the task description.

lunochkin · 2019-03-19T10:50:50Z

@mjdietzx Have you found any solution to the problem?

mjdietzx · 2019-03-19T14:57:07Z

@lunochkin unfortunately no. I am using "web3": "1.0.0-beta.37" and this works

nivida · 2019-03-20T07:28:57Z

@mjdietzx I've tested the production build with version beta.49 and it worked for me. Did you have the time to test it with the latest version?

lunochkin · 2019-03-20T08:29:12Z

@nivida, at least I can confirm that with beta.49 the production build works for me now. Thanks :)

LandingMars · 2019-03-23T04:34:50Z

@nivida I met the same problem, the details are as follows:

import Web3 from 'web3'
let web3 = new Web3(window.web3.currentProvider);
let contract = web3.eth.Contract(abi, addr);
contract.methods.buyTokens(address, code).send({
      from: address,
      value: value,
    }, (err, transactionHash) => {
      if (err) {
        console.log(err);
      }
    }).catch(err => {
         console.log(err);
    })

The error returned is as follows：

Error: No privateKey given to the TransactionSigner.

It is strange that this error only appears when built for production (vue cli 3 / webpack build). I tried several versions and found this to be the case.

devstein · 2019-03-26T20:46:09Z

@nivida I'm also encountering this issue for production react build using the latest 1.0.0-beta.50 build

fireblockdev · 2019-03-27T11:58:12Z

Problem with beta.50 on vuejs. No problem in dev but in production, it doesn't work.

patitonar · 2019-03-27T22:08:46Z

Similar issue for me when trying to call sendTransaction on production build for react app with version 1.0.0-beta.50. Works ok in dev environment

TypeError: Cannot set property 'parameters' of undefined
    at e.<anonymous> (web3-core-method.umd.js:1354)
    at _ (runtime.js:62)
    at Generator._invoke (runtime.js:288)
    at Generator.t.(:8887/anonymous function) [as next] (http://127.0.0.1:8887/static/js/2.bfd5ff30.chunk.js:1:649401)
    at n (asyncToGenerator.js:3)
    at s (asyncToGenerator.js:25)
    at asyncToGenerator.js:32
    at new Promise (<anonymous>)
    at e.<anonymous> (asyncToGenerator.js:21)
    at e.<anonymous> (web3-core-method.umd.js:1381)

patitonar · 2019-03-28T15:23:48Z

After upgrading to 1.0.0-beta.51:

Error: No privateKey given to the TransactionSigner.
    at web3-eth.umd.js:40
    at _ (runtime.js:62)
    at Generator._invoke (runtime.js:288)
    at Generator.t.(:8887/anonymous function) [as next] (http://127.0.0.1:8887/static/js/2.094ff145.chunk.js:1:643910)
    at r (asyncToGenerator.js:3)
    at s (asyncToGenerator.js:25)
    at asyncToGenerator.js:32
    at new Promise (<anonymous>)
    at e.<anonymous> (asyncToGenerator.js:21)
    at e.<anonymous> (web3-eth.umd.js:78)

nivida · 2019-03-28T20:52:31Z

Thanks for testing it @patitonar! This line is the bug. I will fix and release it asap.

ShivamArora · 2019-03-29T07:51:06Z

I'm facing the same issue as @patitonar provided with version 1.0.0-beta.51.
Was facing the DOMException issue earlier the same as @lunochkin with the version 1.0.0-beta.48. Then upgraded the version to 1.0.0-beta.51 and facing the No privateKey given to the TransactionSigner issue.

I'm waiting for this to be fixed.

For now, I've switched back to version 1.0.0-beta.37 and everything is working fine with it.

whatTheHellDie · 2019-04-01T09:04:40Z

1.0.0-beta.51

I'm facing the same issue as @patitonar provided with version 1.0.0-beta.51.
Was facing the DOMException issue earlier the same as @lunochkin with the version 1.0.0-beta.48. Then upgraded the version to 1.0.0-beta.51 and facing the No privateKey given to the TransactionSigner issue.

I'm waiting for this to be fixed.

For now, I've switched back to version 1.0.0-beta.37 and everything is working fine with it.

Can you post your code? I used 1.0.0-beta.37 or this error. I didn't know what to do for one day.

ShivamArora · 2019-04-01T17:55:49Z

@whatTheHellDie I'm away from my machine right now, so can't share the snippet.

But basically I was just trying to send a transaction on my contract using mycontract.methods.someContractMethod(params).send({from:sender_address}).

Downgrading to version 1.0.0-beta.37 worked for me.

Are you facing any problem with 1.0.0-beta.37? I think @nivida has fixed the issue as it seems but I'm yet to try out the latest build.

AyushyaChitransh · 2019-04-02T08:33:41Z

Using 1.0.0-beta.37 does not resolve the issue. I still get errors.

ShivamArora · 2019-04-02T12:09:11Z

Using 1.0.0-beta.37 does not resolve the issue. I still get errors.

Try using the following command:
npm install web3@1.0.0-beta.37 --save --save-exact --unsafe-perm=true

devedse · 2019-04-03T12:39:38Z

@nivida , is this already released?

nikhil3000 · 2019-04-04T19:31:22Z

@devedse Yes it is live. Just use
npm install web3@1.0.0-beta.52 --save --save-exact --unsafe-perm=true

nivida added the more information needed label Mar 6, 2019

nivida added Needs Clarification Requires additional input and removed more information needed labels Mar 11, 2019

mjdietzx closed this as completed Mar 19, 2019

mjdietzx reopened this Mar 19, 2019

nivida added Bug Addressing a bug and removed Needs Clarification Requires additional input labels Mar 27, 2019

nivida mentioned this issue Mar 29, 2019

TransactionSigner updated for production build #2609

Merged

12 tasks

nivida closed this as completed in #2609 Mar 29, 2019

nivida mentioned this issue Apr 4, 2019

Release - 1.0.0-beta.52 #2649

Merged

12 tasks

alcuadrado mentioned this issue Sep 16, 2019

Proposal to stabilize Web3 1.x #3070

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

web3.js does not work when building in vue production mode (likely any webpack production build) #2465

web3.js does not work when building in vue production mode (likely any webpack production build) #2465

mjdietzx commented Mar 6, 2019 •

edited

nivida commented Mar 7, 2019

mjdietzx commented Mar 7, 2019

mjdietzx commented Mar 7, 2019

lunochkin commented Mar 19, 2019 •

edited

lunochkin commented Mar 19, 2019

mjdietzx commented Mar 19, 2019

nivida commented Mar 20, 2019

lunochkin commented Mar 20, 2019

LandingMars commented Mar 23, 2019 •

edited

devstein commented Mar 26, 2019 •

edited

fireblockdev commented Mar 27, 2019

patitonar commented Mar 27, 2019

patitonar commented Mar 28, 2019

nivida commented Mar 28, 2019 •

edited

ShivamArora commented Mar 29, 2019

whatTheHellDie commented Apr 1, 2019

ShivamArora commented Apr 1, 2019

AyushyaChitransh commented Apr 2, 2019

ShivamArora commented Apr 2, 2019

devedse commented Apr 3, 2019

nikhil3000 commented Apr 4, 2019

web3.js does not work when building in vue production mode (likely any webpack production build) #2465

web3.js does not work when building in vue production mode (likely any webpack production build) #2465

Comments

mjdietzx commented Mar 6, 2019 • edited

Description

Expected behavior

Actual behavior

Steps to reproduce the behavior

Error Logs

Gists

Versions

nivida commented Mar 7, 2019

mjdietzx commented Mar 7, 2019

mjdietzx commented Mar 7, 2019

lunochkin commented Mar 19, 2019 • edited

lunochkin commented Mar 19, 2019

mjdietzx commented Mar 19, 2019

nivida commented Mar 20, 2019

lunochkin commented Mar 20, 2019

LandingMars commented Mar 23, 2019 • edited

devstein commented Mar 26, 2019 • edited

fireblockdev commented Mar 27, 2019

patitonar commented Mar 27, 2019

patitonar commented Mar 28, 2019

nivida commented Mar 28, 2019 • edited

ShivamArora commented Mar 29, 2019

whatTheHellDie commented Apr 1, 2019

ShivamArora commented Apr 1, 2019

AyushyaChitransh commented Apr 2, 2019

ShivamArora commented Apr 2, 2019

devedse commented Apr 3, 2019

nikhil3000 commented Apr 4, 2019

mjdietzx commented Mar 6, 2019 •

edited

lunochkin commented Mar 19, 2019 •

edited

LandingMars commented Mar 23, 2019 •

edited

devstein commented Mar 26, 2019 •

edited

nivida commented Mar 28, 2019 •

edited