Apareció un problema en mi proyecto React que no estaba experimentando anteriormente. Estoy bastante seguro de que el problema comenzó después de que actualicé React a v17.0.0 y también varias otras bibliotecas.
Básicamente, una de mis páginas tiene una entrada para cargar una imagen, lo que convierte el archivo en un búfer de matriz para cargarlo en IPFS. Solía funcionar, pero lo probé nuevamente recientemente (después de hacer una serie de actualizaciones de paquetes/bibliotecas como se mencionó) y ahora me da el error TypeError: _utils_ipfs__WEBPACK_IMPORTED_MODULE_5__.default.files.add is not a function .
Para tratar de corregir este error, probé npm update para asegurarme de que todo estuviera actualizado, pero eso no funcionó.
Aquí está el error de consola que recibo:
getHash NewReview.js:18 NewReview NewReview.js:30 React 5 invokePassiveEffectCreate callCallback invokeGuardedCallbackDev invokeGuardedCallback flushPassiveEffectsImpl unstable_runWithPriority scheduler.development.js:468 React 3 runWithPriority$1 flushPassiveEffects commitBeforeMutationEffects workLoop scheduler.development.js:417 flushWork scheduler.development.js:390 performWorkUntilDeadline scheduler.development.js:157 Esto es lo que estoy bastante seguro de que son las partes de NewReview.js relevantes para el error:
import ipfs from "../utils/ipfs"; export default function NewReview() { const [ipfsHash, setIpfsHash] = useState(""); const [buffer, setBuffer] = useState(null); function getHash() { ipfs.files.add(Buffer.from(buffer), (error, result) => { if (error) { console.error(error) return } setIpfsHash(result[0].hash); }}); useEffect(() => { if (buffer) { getHash() } }); // ... Así es como se ve ipfs.js :
const { create } = require('ipfs-http-client'); const ipfs = create({host: 'ipfs.infura.io', port: 5001, protocol: 'https'}); export default ipfs; Como otro intento de rectificar este problema, intenté usar ipfs.default.files.add como lo había visto como una solución sugerida en otra publicación de Stack Overflow, pero desafortunadamente no funcionó. Nuevamente, el código solía funcionar perfectamente tal como está, por lo que no estoy seguro de que la causa de este problema se deba a un error en la forma en que se escribió el código.
¡Gracias por tu ayuda! Si necesitas que te elabore algo, no dudes en preguntar.
¡Me las arreglé para resolver mi problema por mi cuenta! Esto es lo que estaba saliendo mal.
El TypeError en realidad fue causado por el hecho de que había cambiado de ipfs-api a ipfs-http-client . ipfs.files.add no es una función válida en ipfs-http-client , lo que explica por qué recibí ese TypeError . Cambié la línea a ipfs.add y pude hacer que funcionara.
También me gustaría señalar que tuve que usar ipfs.add como parte de una función async/await await para que funcione, ya que de lo contrario no parece ejecutarse en absoluto. Descubrir eso fue un problema totalmente separado que también me llevó una cantidad razonable de tiempo. Francamente, no creo que la necesidad de que sea parte de una función async/await esté muy bien documentada.