react-native-web is a library aims to make react-native projects able to run in web browser, by providing the same Components and APIs of react-native for web.
Questions tagged [react-native-web]
534 questions
3
votes
4 answers
react-app-rewired build throws attempted import error
I have react project. When I use craco build, I get the following error:
node_modules/@react-navigation/core/lib/module/getStateFromPath.js
Attempted import error: 'parse' is not exported from 'query-string' (imported as 'queryString').
So…

CodeForFun
- 35
- 10
3
votes
1 answer
How to check if a key is pressed/held down using event listeners and hooks in React Native?
If I need to know whether a key like the shift key is currently being pressed, how can I find that info? This solution should assign this info into a single variable that can be called like this:
if(shiftHeld){
//Do the thing.
}

Austin Poulson
- 685
- 7
- 22
3
votes
0 answers
React Native App using native-base and react-native-web fails to compile on web
I'm using react-native-web and native-base to build an app (bootstrapped by CRA-typescript template) and the following error is thrown on the compilation.
I have followed the exact same steps mentioned in the official docs of native-base setup with…

Nirmit Agarwal
- 289
- 1
- 6
3
votes
1 answer
Get path to Screen from its name, to use with useLinkProps
I have a mobile app with Expo.
To move from one screen to the other, I use react-navigation's navigation.navigate(SCREEN_NAME)
I am building the web version of this app and would like my buttons to be links, instead of using navigate. This way,…

Ryan Pergent
- 4,432
- 3
- 36
- 78
3
votes
1 answer
Previous screen is popped with current screen either, when user goes back by device or browser back button in drawerContent, react-navigation v5
I'm using react-navigation-v5 and react-native-web in a monorepo architecture.
My stack hierarchy is like this
-- drawer
|-- splashScreen
|-- authStack
|-- appStack
|-- categoryListScreen
|-- searchScreen
|--…

Mohammad
- 792
- 1
- 7
- 15
3
votes
1 answer
React Navigation Bottom Tabs doesn't work with React Native for Web
I'm building a web app using react-native-web with @react-navigation/bottom-tabs.
But the screen content doesn't appear on the web, it only shows the Tab Bar. It works fine on iOS and Android.
Here is the code:
import {createBottomTabNavigator} from…

Dinh Quan
- 1,257
- 2
- 11
- 10
3
votes
1 answer
Web push notifications for web version of Expo project?
I'm working on an expo project and I want to add push notification functionality for the web version (which builds with React Native Web). I'm specifically talking about implementing push notifications that can be sent to users who only use the…

GJW
- 83
- 1
- 8
3
votes
1 answer
React navigation webpack linking "CANNOT GET /..."
I am trying to configure react-navigation for a web app with react native. For that I set up the linking options on a NavigationContainer so that I can access my pages from a browser url, using this code :
const linking = {
prefixes:…

Pijean
- 111
- 7
3
votes
1 answer
React Native, Expo 39: Scan barcodes using expo-camera in Web
Recently, Expo got a nice upgrade to version 39 and they claim you can now scan barcodes in the Browser using expo-camera: https://dev.to/expo/expo-sdk-39-is-now-available-1lm8
It works fine for Android and iOS, but I still can't use it in the…

Juan Vieira
- 173
- 1
- 9
3
votes
2 answers
React native web issue with react native vector icons in storybook
I created a project using react native web and I got react native icons working for web and mobile except on storybook. I'm not sure how to tell storybooks webpack config to load FontAwesome fonts. I tried adding FontAwesome in the preview-head.html…

Will
- 309
- 1
- 4
- 13
3
votes
0 answers
How to use react-native-vector-icons in react native web version?
I am trying to create a hybrid app using react native that runs simultaneously on android and web.Hence tried using the react-native-vector-icons package,but when I try to run,the android version is compiling without any error,although the web…

TRINA CHAUDHURI
- 627
- 1
- 11
- 42
3
votes
0 answers
React Navigation + React Native Web - Navigating to same screen multiple times in drawer navigator does not add to browser history
I am using React Navigation v5 with React Native Web to create a chat UI similar to Slack, Discord, Messages for Web, etc. I'm using Drawer Navigator with custom drawer content containing links to a Chat screen passing a param for the chat ID. Using…

skbvc
- 31
- 1
3
votes
0 answers
addEventListener on url in React Native Web
I am trying to have a function called on an event listener in React Native Web.
I have this code in my class constructor:
Linking.addEventListener('url', this.onOpenURL);
And then later on in my program, I use:
Linking.openURL(url);
This opens the…

Steven Matthews
- 9,705
- 45
- 126
- 232
3
votes
1 answer
Error while adding react native vector icons to react native with react native web
I follow this tutorial to add react-native-web to react-native project. but
I got error when adding react-native-vector-icons to project.
./node_modules/react-native-vector-icons/lib/create-icon-set.js
SyntaxError:…

BeHappy
- 3,705
- 5
- 18
- 59
3
votes
3 answers
How to create a linear gradient in react-native (on top of an image and under the app bar)
I am working with expo SDK 36
I want to add on top of an image and under the app bar a linear gradient so it will always display the back button, as follow:
This is what I have tried with react-native-svg but it doesn't display anything:
…

Dimitri Kopriwa
- 13,139
- 27
- 98
- 204