0
482
ViewsProblema Web3: la aplicación React no se compila
Tengo un problema con la aplicación React durante la compilación. Encuentre el problema a continuación y la captura de pantalla.
ERROR in ./node_modules/web3-providers-http/lib/index.js 30:11-26 Module not found: Error: Can't resolve 'http' in '/Users/rohit/Downloads/Personal/web3/react-minting-website/node_modules/web3-providers-http/lib' BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default. This is no longer the case. Verify if you need this module and configure a polyfill for it. If you want to include a polyfill, you need to: - add a fallback 'resolve.fallback: { "http": require.resolve("stream-http") }' - install 'stream-http' If you don't want to include a polyfill, you can use an empty module like this: resolve.fallback: { "http": false } @ ./node_modules/web3-core-requestmanager/lib/index.js 56:16-46 @ ./node_modules/web3-core/lib/index.js 23:23-58 @ ./node_modules/web3/lib/index.js 32:11-31 @ ./src/index.js 10:0-24 14:13-17 
En el escrutinio, descubrí que el problema está relacionado con las dependencias web3:
https://www.npmjs.com/package/web3 https://www.npmjs.com/package/@web3-react/core https://www.npmjs.com/package/@web3-react/injected-connector¿Puede alguien ayudarme con lo mismo? Estoy usando versiones LTS, ¿cuáles son las versiones estables de estas?
Por favor sugiera algo.
3 answers
Answer question0
Update 25/01/2022
Ahora web3.js ha actualizado su archivo Léame para incluir pasos de solución de problemas. Visita el enlace para saber más.
Actualmente, CRA envía react-scripts con la versión 5.0.0 . En lugar de expulsar CRA, simplemente rebaje react-scripts a la versión 4.0.3 . Estaba enfrentando el mismo problema, la degradación funcionó para mí.
Primero elimine la versión anterior
npm uninstall react-scriptsLuego ejecuta lo siguiente:
npm i react-scripts@4.0.30
a medida que webpack crece en tamaño, eliminaron los polyfills en webpack5. Parece que está utilizando create-react-app (CRA) y la configuración del paquete web no está expuesta al usuario en CRA. puedes exponerlo usando eject . es posible que tenga este script en package.json:
"eject": "react-scripts eject" así que ejecuta npm run eject . Esto no se recomienda porque significa que ya no se beneficiará de las actualizaciones de CRA.
puede manejar la expulsión con rewire o craco .
Después de obtener la configuración del paquete web, debe agregar la propiedad resolve a la configuración del paquete web e instalar todos los paquetes necesarios:
resolve: { extensions: [".js", ".css"], alias: { // add as many aliases as you like! // optional components: path.resolve(__dirname, "src/components"), }, fallback: { // path: require.resolve("path-browserify"), fs: false, assert: require.resolve("assert/"), os: require.resolve("os-browserify/browser"), constants: require.resolve("constants-browserify"), stream: require.resolve("stream-browserify"), crypto: require.resolve("crypto-browserify"), http: require.resolve("stream-http"), https: require.resolve("https-browserify"), }, }, Tengo webpac5 Boilerplate . Puedes usarlo si quieres:
Dado que hay demasiados polyfills, en lugar de instalarlos todos manualmente, puede usar el paquete node-polyfill-webpack-plugin . en lugar de propiedad
fallbackconst NodePolyfillPlugin = require("node-polyfill-webpack-plugin"); plugins: [ new HtmlWebpackPlugin({ title: "esBUild", template: "src/index.html", }), // instead of fallback new NodePolyfillPlugin(), new webpack.ProvidePlugin({ process: "process/browser", Buffer: ["buffer", "Buffer"], React: "react", }), ],
0
Web3 y Create-react-app Si está utilizando la versión create-react-app >=5, es posible que tenga problemas para crear. Esto se debe a que los polyfills de NodeJS no están incluidos en la última versión de create-react-app.
Consulte la solución en el siguiente enlace
https://github.com/ChainSafe/web3.js#troubleshooting-and-known-issues