aspen-cloud / triplit

A full-stack, syncing database that runs on both server and client. Pluggable storage (indexeddb, sqlite, durable objects), syncs over websockets, and works with your favorite framework (React, Solid, Vue, Svelte).
https://triplit.dev
GNU Affero General Public License v3.0
875 stars 28 forks source link

Using triplit with react native, running into some problems #98

Closed tanishqkancharla closed 2 weeks ago

tanishqkancharla commented 2 weeks ago

I'm running into a few problems trying to use triplit with react native. One is that after installing triplit, i see this anytime i install:

code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR! 
npm ERR! While resolving: react-native@0.72.6
npm ERR! Found: react@18.3.1
npm ERR! node_modules/react
npm ERR!   react@"^18.3.1" from the root project
npm ERR!   peer react@"^16.8.0 || ^17.0.0 || ^18.0.0" from @ahooksjs/use-url-state@3.5.1
npm ERR!   node_modules/@ahooksjs/use-url-state
npm ERR!     @ahooksjs/use-url-state@"^3.5.1" from @triplit/console@0.3.44
npm ERR!     node_modules/@triplit/console
npm ERR!       @triplit/console@"^0.3.44" from @triplit/cli@0.3.47
npm ERR!       node_modules/@triplit/cli
npm ERR!         dev @triplit/cli@"^0.3.47" from the root project
npm ERR!   33 more (@emotion/react, ...)
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer react@"18.2.0" from react-native@0.72.6
npm ERR! node_modules/react-native
npm ERR!   react-native@"0.72.6" from the root project
npm ERR!   peer react-native@"^0.0.0-0 || 0.60 - 0.72 || 1000.0.0" from @react-native-async-storage/async-storage@1.18.2
npm ERR!   node_modules/@react-native-async-storage/async-storage
npm ERR!   11 more (@react-native-community/checkbox, ...)
npm ERR! 
npm ERR! Conflicting peer dependency: react@18.2.0
npm ERR! node_modules/react
npm ERR!   peer react@"18.2.0" from react-native@0.72.6
npm ERR!   node_modules/react-native
npm ERR!     react-native@"0.72.6" from the root project
npm ERR!     peer react-native@"^0.0.0-0 || 0.60 - 0.72 || 1000.0.0" from @react-native-async-storage/async-storage@1.18.2
npm ERR!     node_modules/@react-native-async-storage/async-storage
npm ERR!     11 more (@react-native-community/checkbox, ...)
npm ERR! 
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR! 
npm ERR! See /Users/tanishqkancharla/.npm/eresolve-report.txt for a full report.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/tanishqkancharla/.npm/_logs/2024-04-28T23_11_58_027Z-debug-0.log

something about peer dependencies.

matlin commented 2 weeks ago

Are you using plain React Native or Expo?

tanishqkancharla commented 2 weeks ago

Expo. Here's my package.json:

{
    "name": "shortlist",
    "version": "1.0.0",
    "main": "node_modules/expo/AppEntry.js",
    "scripts": {
        "tsc": "tsc --noEmit",
        "start": "expo start",
        "android": "expo run:android",
        "ios": "expo run:ios",
        "web": "expo start --web",
        "test": "vitest --no-isolate",
        "deploy": "eas build --profile preview --platform ios",
        "ionic:serve": "npm run start"
    },
    "dependencies": {
        "@internationalized/date": "^3.5.1",
        "@react-native-anywhere/polyfill-base64": "^0.0.1-alpha.0",
        "@react-native-community/checkbox": "^0.5.16",
        "@react-native-community/netinfo": "^11.1.1",
        "@react-navigation/native-stack": "^6.9.17",
        "@triplit/react": "^0.3.42",
        "@types/lodash-es": "^4.17.12",
        "@types/react": "~18.2.14",
        "event-target-polyfill": "^0.0.4",
        "expo": "~49.0.15",
        "expo-build-properties": "~0.8.3",
        "expo-checkbox": "~2.4.0",
        "expo-dev-client": "~2.4.12",
        "expo-device": "~5.4.0",
        "expo-haptics": "~12.4.0",
        "expo-notifications": "~0.20.1",
        "expo-splash-screen": "~0.20.5",
        "expo-status-bar": "~1.6.0",
        "hasown": "^2.0.2",
        "lodash-es": "^4.17.21",
        "position-strings": "^2.0.1",
        "react": "^18.3.1",
        "react-native": "0.72.6",
        "react-native-get-random-values": "^1.11.0",
        "react-native-reanimated": "~3.3.0",
        "react-native-safe-area-context": "4.6.3",
        "react-native-screens": "~3.22.0",
        "react-native-url-polyfill": "^2.0.0",
        "teg-parser": "^0.15.0",
        "tuple-database": "^2.2.4",
        "typescript": "^5.1.3"
    },
    "devDependencies": {
        "@babel/core": "^7.20.0",
        "@types/diff": "^5.0.9",
        "diff": "^5.1.0",
        "pretty-format": "^29.7.0",
        "tsx": "^4.7.1",
        "vitest": "^1.1.0"
    },
    "private": true
}
wernst commented 2 weeks ago

Hi @tanishqkancharla thanks for the heads up. It looks like we were erroneously including react-dom as a peer dep which was causing resolution issues. We just pushed a release out so using the latest @triplit/react package (0.3.34) should install properly.

Going to close for now, but happy to re-open the issue if there's still problems with the install.

tanishqkancharla commented 2 weeks ago

boom! No more problems, thanks!