Web3 formatter.js 加载问题答案

【问题标题】：Web3 formatter.js loading issueWeb3 formatter.js 加载问题
【发布时间】：2021-05-28 03:37:22
【问题描述】：

我正在尝试使用 NextJS 创建一个小型以太坊区块链应用程序。

Import Web3 引起了一些问题

ModuleParseError: Module parse failed: C:\Path\node_modules\web3-core-helpers\lib\formatters.js Unexpected token (296:20)
You may need an appropriate loader to handle this file type.
|     // If options !== undefined, don't blow out existing data
|     if (options.fromBlock === undefined)
|         options = { ...options, fromBlock: 'latest' };
|     if (options.fromBlock || options.fromBlock === 0)
|         options.fromBlock = inputBlockNumberFormatter(options.fromBlock);
    at C:\Path\node_modules\webpack\lib\NormalModule.js:303:19
    at C:\Path\node_modules\webpack\lib\NormalModule.js:209:11
    at C:\Path\node_modules\loader-runner\lib\LoaderRunner.js:373:3
    at iterateNormalLoaders (C:\Path\node_modules\loader-runner\lib\LoaderRunner.js:214:10)
    at C:\Path\node_modules\loader-runner\lib\LoaderRunner.js:205:4
    at C:\Path\node_modules\enhanced-resolve\lib\CachedInputFileSystem.js:70:14
    at processTicksAndRejections (internal/process/task_queues.js:75:11)

import Web3 from "web3"; 是根本原因

import Web3 from "web3";

const web3 = new Web3(window.ethereum);

export default web3;

这是我的 package.json

{
  "name": "myproject",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "mocha",
    "dev": "next dev"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "@truffle/hdwallet-provider": "^1.2.2",
    "fs-extra": "^9.1.0",
    "ganache-cli": "^6.12.2",
    "mocha": "^8.3.0",
    "next": "^4.1.4",
    "react": "^16.14.0",
    "react-dom": "^16.14.0",
    "solc": "^0.4.17",
    "web3": "^1.3.4"
  }
}

我需要其他模块吗？我注意到在使用 npx create-next-app 创建应用程序时，相同的导入正在工作，但我想使用特定版本，所以我只在我的节点项目中使用了npm install --save next@4.1.4 react@16 react-dom@16。

【问题讨论】：

可能不相关，但有什么理由使用非常旧的 Next.js 版本？

标签： webpack next.js web3

【解决方案1】：

我遇到了同样的问题，似乎我可以通过使用命令“npm install next@10.0.7”更新下一个来解决它

我在运行“npm audit”后找到了这个解决方案，它推荐了上述命令来解决各种依赖问题。

【讨论】：

【解决方案2】：

使用 Web3 v1.2.9

为我工作！

【讨论】：

这个解决方案对我有用。我正在关注 Stephen Grider 的教程，在第 7 节，构建 Kickstarter 克隆中，我发现了这个错误。将 package.json 更改为包含 web 1.2.9 并运行 npm install 为我解决了这个问题。谢谢！

【解决方案3】：

enter image description here

使用 Object.assgn 替换 ... 成功了

【讨论】：

@SevenYa 欢迎来到 SO！请不要使用屏幕截图作为答案。粘贴您的代码并相应地格式化。

【解决方案4】：

这个错误的原因在消息中很明显，可能是因为较新的 javascript 中的... 表示法，因为你使用的下一个是旧的，它没有意义。你有 3 个选项（我做了第 3 个）

使用options = Object.assign(options, {fromBlock: latest})将那段代码更改为旧语法
使用更新的 next 可以实现新的语法
使用不使用新语法的旧 web3，@1.2.9 有效。不要忘记npm install

【讨论】：

嗨@Yash我遇到了这个问题。降级按照您的建议进行，但是在使用 1.2.9 版本时，npm audit 报告了数百个漏洞。你是怎么解决这个问题的？
是的，作为一名智能合约开发人员，你会发现你使用的很多工具都有很多漏洞，因为它们可能使用了很多过时的包。没有解决办法。我可以建议使用最新版本，它们通常较少