Closed jasonhtpham closed 1 year ago
Hello @jasonhtpham , In web3 v4, this is how you import it:
import { Web3 } from "web3";
This is documented in the migration guide in the docs.
I will close the issue. However, please, feel free to open it if you used this and you are still facing the same error. And if you used this but faced another error message. Please open a new issue for it.
Have a nice day,
Hi @Muhammad-Altabba, I just tried:
import { Web3 } from 'web3';
export const web3 = new Web3(Web3.givenProvider || "ws://localhost:8545");
It still gives the same error.
Thanks @jasonhtpham , We will look into it... Could you please provide a full example where we can produce the same error? You might refer to a small repository on GitHub or create a sample on a Cloud IDE like https://codesandbox.io/. Thanks,
Hi @Muhammad-Altabba, please refer to this repo:
https://github.com/jasonhtpham/react-boilerplate.git
I used this as testing codebase. I added web3 to package.json
, I imported the web3 package in /Users/deakin/Documents/dev/react-frontend-boilerplate/src/views/dependants/Example/Example.js
.
Then, I installed and ran using npm
as usual. Then, I faced the same issue.
I am using:
I am also able to reproduce above issue, and got:
./node_modules/web3/dist/web3.min.js 4323:57
Module parse failed: Unexpected token (4323:57)
File was processed with these loaders:
* ./node_modules/babel-loader/lib/index.js
You may need an additional loader to handle the result of these loaders.
| b = f(y * v),
| E = f(h * v),
> _ = g.BASE.multiplyAndAddUnsafe(l, b, E)?.toAffine();
| return !!_ && f(_.x) === h;
| },
@jasonhtpham Thanks for details. It should be investigated and fixed in next sprint. cc: @mconnelly8
Hello @jdevcs , Does this error resolve when using this configuration in package.json for babel?: https://github.com/web3/web3.js/issues/6187#issuecomment-1601223430
"browserslist": {
"production": [
"chrome >= 67",
"edge >= 79",
"firefox >= 68",
"opera >= 54",
"safari >= 14"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
Hello @jasonhtpham , I am investigating your issue and I noticed the usage of old versions for some dependencies. I suggest that you upgrade the dependencies to latest versions...
Hi @jasonhtpham,
This error comes because babel-loader in your project does not understand the syntax ?.
which is called "Optional Chaining" (https://2ality.com/2019/07/optional-chaining.html) which was introduced in ES2020.
And the error is supposed to be resolved once you update your project to be able to parse ES2020 (and it may be resolved if you disabled babel for node_modules. You may try that).
However, form our side, we will also work on ensuring the syntax used in the minified file is es5. And I created an issue to trace the work on this.
Expected behavior
Web3 gets imported and ready to be used.
Actual behavior
When I remove the import of the web3 my application works fine.
Steps to reproduce the behavior
npm i web3
npm start
Logs
N/A
Environment
This is my package.json:
This is my
web3.js
file: