Attempted import error: 'TextDecoder' is not exported from '@polkadot/x-textdecoder'

[ImportNN]

HI everyone!
I'm trying to install reef.js in my react app but I'm getting the error:

./node_modules/@polkadot/util/u8a/toString.js Attempted import error: 'TextDecoder' is not exported from '@polkadot/x-textdecoder'

This seems to be a problem with the polkadot.js library too, because I'm getting the same error.

Yarn : yarn -v: 1.22.10

My package.json looks like this:
"dependencies": {
"@craco/craco": "^6.4.3",
"@open-wc/webpack-import-meta-loader": "^0.4.7",
"@polkadot/api": "^7.8.1",
"@polkadot/rpc-core": "^7.8.1",
"@polkadot/types": "^7.8.1",
"@polkadot/types-known": "^7.8.1",
"@polkadot/util": "^8.4.1",
"@reef-defi/api": "^1.0.3",
"@reef-defi/evm-provider": "^1.0.4",
"@reef-defi/extension-dapp": "^0.41.4",
"@testing-library/jest-dom": "^5.14.1",
"@testing-library/react": "^12.0.0",
"@testing-library/user-event": "^13.2.1",
"craco": "^0.0.3",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-scripts": "4.0.3",
"web-vitals": "^1.0.1"
},
"scripts": {
"start": "craco start",
"build": "craco build",
"test": "craco test",
"eject": "craco eject"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
],
"rules": {
"no-console": "warn"
}
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"@babel/preset-react": "^7.16.7",
"craco-alias": "^3.0.1",
"prettier": "^2.5.1"
}

[jbargu]

I am not sure what the exact resolved polkadot versions in your case are, but try using the ones here https://github.com/reef-defi/evm-provider.js/blob/master/package.json#L26

Note the ~. I am fairly certain that ^7.8.1 pulls in the new incompatible packages. Before doing anything, make sure to run rm -rf node_modules yarn.lock to remove the old packages.