Expo 36: Unable to resolve "../../data" from "node_modules/css-tree/lib/syntax/default.js"

Question

Got this error after upgrading expo 35 to 36.

Unable to resolve "../../data" from "node_modules/css-tree/lib/syntax/default.js"

I've tried to yarn add css-tree. This error was gone, but then module react-native-svg started giving the same error with it's included css-tree module.

I've tried to upgrad expo-cli to the latest version and restart terminal. I'm running builds with expo start -c to ensure cache doesn't affect it. I've tried to delete app from the simulator. Still the same.

I've been able to apply a temporary fix by upgrading css-tree dependency inside the react-native-svg, but this is a really wrong way to go as far as I know.

Any ideas?

Shook

Answer 1

I found a way to fix it, you just need to install css-tree package on your project.

npm install css-tree

or if you are using yarn

yarn add css-tree

Quyenr

Answer 2

as of SDK 38 this problem still shows up and seems to be caused by a version resolution issue where Yarn/NPM understands 1.0.0-alpha9 to be more recent then 1.0.0-alpha.37 (which is the minimum requirement for react-native-svg-transformer).

Using the resolutions override with Yarn 2 or Yarn 1 as follows fixed it for me with no other extra tweaking.

"resolutions": {
    "css-tree": "1.0.0-alpha.39"
}

"resolutions": {
    "**/css-tree": "1.0.0-alpha.39"
}

Sorites

Answer 3

I needed to use react-native-svg-icon ran into the exact same issue.

I'm also running Expo SDK v36, and when it suggested me to install react-native-svg via the cli : expo install react-native-svg, that's what I did; there were errors with this approach most notably when you use import { Circle } from 'react-native-svg' (for newer versions of the package) and 'expo' sometimes doesn't install the package.json properly so I found installing the same version of react-native-svg w/o expo cli was the best approach.

Try running this npm i [email protected]

Fixed it for me.

Marthena

Answer 4

This issue occurred for me when building my app using MS App Center, the App Center build scripts picked up on an old yarn.lock file in the project using the line if [ -f yarn.lock ]; then { yarn install && yarn list --depth=0; } else npm install; fi however I normally use npm rather than Yarn.

Removing this file allowed the build to use npm which resolved this issue.

Minter

Answer 5

I resolved this by installing:

npm install mdn-data

Halicarnassus