[英]Numerous errors when importing web3 into app.js
尝试将 web3 导入 App.js 时出现 9 个错误
import React from "react";
import Web3 from "web3";
function App() {
return (
<div className="App">
<h1>TEST APP</h1>
</div>
);
}
export default App;
编译有问题:X
/node_modules/cipher-base/index.js 3:16-43 中的错误
找不到模块:错误:无法解析“/home/galich/Desktop/projects/mp-test/node_modules/cipher-base”中的“流”
重大更改:webpack < 5 用于默认包含 node.js 核心模块的 polyfill。 这已不再是这种情况。 验证你是否需要这个模块并为它配置一个 polyfill。
如果你想包含一个 polyfill,你需要: - 添加一个后备 'resolve.fallback: { "stream": require.resolve("stream-browserify") }' - 安装 'stream-browserify' 如果你不想要包含一个 polyfill,你可以使用这样的空模块:resolve.fallback: { "stream": false }
/node_modules/eth-lib/lib/bytes.js 9:193-227 中的错误
找不到模块:错误:无法解析“/home/galich/Desktop/projects/mp-test/node_modules/eth-lib/lib”中的“crypto”
重大更改:webpack < 5 用于默认包含 node.js 核心模块的 polyfill。 这已不再是这种情况。 验证你是否需要这个模块并为它配置一个 polyfill。
如果你想包含一个 polyfill,你需要: - 添加一个后备 'resolve.fallback: { "crypto": require.resolve("crypto-browserify") }' - 安装 'crypto-browserify' 如果你不想要包含一个 polyfill,你可以使用这样的空模块:resolve.fallback: { "crypto": false }
/node_modules/web3-eth-accounts/lib/index.js 31:74-91 中的错误
找不到模块:错误:无法解析“/home/galich/Desktop/projects/mp-test/node_modules/web3-eth-accounts/lib”中的“crypto”
等等
第一个选项:
使用npm install react-app-rewired node-polyfill-webpack-plugin
或yarn add react-app-rewired node-polyfill-webpack-plugin
polyfill-webpack-plugin 安装NodePolyfillPlugin和react-app- rewired。
现在将"start": "react-scripts start"
更改为"start": "react-app-rewired start"
。
创建一个文件“config-overrides.js”并在其中写入以下代码:
const NodePolyfillPlugin = require("node-polyfill-webpack-plugin");
module.exports = function override(config, _env) {
config.plugins.push(
new NodePolyfillPlugin({
excludeAliases: ["console"],
})
);
return config;
};
现在做"npm start"
和Hurray
第二个选项:
而不是像这样导入:
import Web3 from "web3";
像这样导入:
import Web3 from "web3/dist/web3.min.js";
这也将解决您的问题。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.