ixartz / react-native-boilerplate Goto Github PK

After cloning & running npm install, this issue seems to be present

npm run web

[email protected] web
expo start --web

Starting project at ~/Documents/repos/boilerplate
Starting Metro Bundler
Some dependencies are incompatible with the installed expo version:
[email protected] - expected version: ~0.20.5
[email protected] - expected version: ~2.12.0
Your project may not work correctly until you install the correct versions of the packages.
Fix with: npx expo install --fix
▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄
█ ▄▄▄▄▄ █ █▄▀▀▄██ ▄▄▄▄▄ █
█ █ █ █ ▀▄ █▀█ ██ █ █ █
█ █▄▄▄█ █▀██▀▀█▀▄██ █▄▄▄█ █
█▄▄▄▄▄▄▄█▄▀▄█ █▄█▄█▄▄▄▄▄▄▄█
█▄ ▀█▄ ▄██▀▀▄▀█▄ ███ ▀▄▄ ▄█
█▀█▀▀ █▄▄ █▀ ▄██ ▀▀ █▄ ▀██
█▀██ ▀▄▄█▀█▄█▄▀▄▀▄▀▄▀▀▄ ▀██
███▄█▄█▄▄ ▄█▀██▄▄▄█▄▀ ▀███
█▄▄█▄█▄▄█ █▀▄▀█▄▄ ▄▄▄ ▀ ▄▄█
█ ▄▄▄▄▄ █▀▄▄ ▄██▀ █▄█ ▀▀█▀█
█ █ █ █▄█▄█▄▀▄█▄▄ ▄▄▀ █
█ █▄▄▄█ █▀▄▄█▀█▀▄██▄▀█▀▀ ██
█▄▄▄▄▄▄▄█▄▄█▄▄▄▄████▄▄▄▄▄▄█

› Metro waiting on exp://192.168.1.48:8081
› Scan the QR code above with Expo Go (Android) or the Camera app (iOS)

› Web is waiting on http://localhost:8081

› Using Expo Go
› Press s │ switch to development build

› Press a │ open Android
› Press i │ open iOS simulator
› Press w │ open web

› Press j │ open debugger
› Press r │ reload app
› Press m │ toggle menu
› Press o │ open project code in your editor

› Press ? │ show all commands

Logs for your project will appear below. Press Ctrl+C to exit.
Web Bundling failed 810ms
Unable to resolve "react-native-web/dist/exports/DrawerLayoutAndroid" from "node_modules/react-native-gesture-handler/lib/module/components/GestureComponents.web.js"

Potentially fixed with npx expo install react-native-gesture-handler

I might be wrong but there seems to be omission of the device import in the Jest setup file in the e2e folder

the code in there is

beforeAll(async () => {
  await device.launchApp();
});

beforeEach(async () => {
  await device.reloadReactNative();
});

and adding
import { device } from 'detox';
seems to fix it

I believe it's related to this issue here marklawlor/nativewind#470, but out of the box, the nativewind styling is not applied on the web.

Adding import { NativeWindStyleSheet } from "nativewind";

NativeWindStyleSheet.setOutput({
default: "native",
});

to the _layout.tsx seems to fix this, but I'm not sure if this the proper solution