I have a little script in ReactJS :
import './App.css';
import { useState, useEffect } from 'react';
//Import de la librairie ethers (comme web3.js)
import { ethers } from 'ethers';
const { MerkleTree } = require('merkletreejs')
const keccak256 = require('keccak256');
const tokens = require('./tokens.json')
function App() {
function isWhitelisted() {
let tab = [];
tokens.map(token => {
tab.push(token.address);
})
const leaves = tab.map(v => keccak256(v));
console.log(leaves);
const tree = new MerkleTree(leaves, keccak256, { sort: true });
const leaf = keccak256("0x7D8a1f6A5efc16E88FeF87E7745EAc2F5Cbc88D7")
const proof = tree.getHexProof(leaf);
}
return (
<div className="App">
<button onClick={isWhitelisted}>TEST</button>
</div>
);
}
export default App;
Sadly, I have this error when executing the script :
keccak.js:41 Uncaught ReferenceError: Buffer is not defined
at Keccak.update (keccak.js:41)
at keccak256 (keccak256.js:11)
at App.js:16
at Array.map (<anonymous>)
at isWhitelisted (App.js:16)
at HTMLUnknownElement.callCallback (react-dom.development.js:3945)
at Object.invokeGuardedCallbackDev (react-dom.development.js:3994)
at invokeGuardedCallback (react-dom.development.js:4056)
at invokeGuardedCallbackAndCatchFirstError (react-dom.development.js:4070)
at executeDispatch (react-dom.development.js:8243)
So the error is right there :
const leaves = tab.map(v => keccak256(v));
But I can't find a solution sadly, can you guys help me plz ? Thx !