---
title: "Cómo hacer polyfill de módulos core de node en webpack 5"
description: "Aprende cómo hacer polyfill de módulos core de node en webpack versión 5 y superior usando el paquete react-app-rewired, instalando las dependencias necesarias y sobrescribiendo la configuración predeterminada de webpack."
---

# Cómo hacer polyfill de módulos core de node en webpack 5

En este tutorial, aprenderás a hacer polyfill de los módulos core de Node en webpack versión 5 y superior usando el **paquete react-app-rewired**, instalando las dependencias necesarias y sobreescribiendo la configuración predeterminada de webpack.

### ¿Qué causa el error de polyfill de módulos core de node?

Hasta la última actualización de webpack versión \_\_\_, webpack \< 5 solía incluir polyfills de NodeJS por defecto. Debido a que la [versión actual de webpack](https://github.com/webpack/webpack) ya no incluye polyfills de NodeJS por defecto, esto está causando problemas a los desarrolladores que usan create-react-app con webpack \> 5 para construir aplicaciones con las librerías [web3.js](https://www.alchemy.com/dapps/web3-js) y [alchemyweb3.js](https://www.alchemy.com/docs/alchemy-quickstart-guide).

Así es como se ve el error de polyfill de módulos core de node:

## 4 pasos simples para corregir el error de polyfill de módulos core de node en webpack 5

El problema principal con create-react-app y el error de polyfill es que create-react-app, por defecto, **oculta el archivo de configuración de webpack dentro de node-modules**, y al hacer esto, genera el archivo en el momento del build, dejando a los desarrolladores sin poder modificarlo.

Por suerte existe un paquete, [react-app-rewired](https://www.npmjs.com/package/react-app-rewired), que permite a los desarrolladores editar fácilmente el archivo de configuración de webpack y corregir el error de polyfill de módulos core de node.

### 1. Instala react-app-rewired

Primero, instala el paquete react-app-rewired con tu gestor de paquetes preferido.

Instala el paquete react-app-rewired con yarn:

Instala el paquete react-app-rewired con npm:

### 2. Instala las dependencias faltantes

A continuación, instala estas dependencias faltantes:

- crypto-browserify
- stream-browserify
- assert
- stream-http
- https-browserify
- os-browserify
- url

Instala las dependencias faltantes con yarn:

yarn add process crypto-browserify stream-browserify assert stream-http https-browserify os-browserify url buffer

Instala las dependencias faltantes con npm:

### 3. Sobreescribe el archivo de configuración de webpack de create-react-app

En la carpeta raíz de tu proyecto, crea un nuevo archivo llamado config-overrides.js, y agrégale el siguiente código:

Este fragmento de código de config-overrides.js le indica a webpack cómo resolver las dependencias faltantes que se necesitan para dar soporte a las librerías de web3 y a los proveedores de wallets en el navegador.

### 4. Sobreescribe el package.json para incluir la configuración de webpack

Dentro del archivo package.json, reemplaza **react-scripts** por los scripts de **react-app-rewired** en los siguientes tres campos de scripts para actualizar la configuración de webpack:

- start
- build
- test

Así es como se ve el archivo package.json **antes** de reemplazar los react-scripts:

Así es como se ve el archivo package.json **después** de reemplazar los react-scripts por los scripts de react-app-rewired:

¡Eso es todo!

Ahora, el error de polyfill de módulos core de node debería estar corregido, los polyfills de NodeJS faltantes deberían estar incluidos en tu aplicación, y tu aplicación debería funcionar con web3.js y con la librería [Alchemyweb3.js](https://github.com/alchemyplatform/alchemy-web3).
