I use react-native-app and expo to build a project called UdaciFitness, but I come across some problems when I use 'import '#expo/vector-icon''
the error message in windows CMD is
17:41:21: Unable to resolve #expo/vector-icons" from "./C:\\Users\\acer\\WebstormProjects\\UdaciFitness\\node_modules\\expo\\src\\Icon.js"
17:41:21: Failed building JavaScript bundle
18:16:28: Unable to resolve #expo/vector-icons" from "./C:\\Users\\acer\\WebstormProjects\\UdaciFitness\\node_modules\\expo\\src\\Icon.js"
here is part of my package.json:
"dependencies": {
"expo": "^25.0.0",
"react": "16.2.0",
"react-native": "0.52.0"
}
You need to install #expo/vector-icons. Run yarn add #expo/vector-icons in your project directory to add it to package.json and install the package. Then restart the Expo tools and load your project again.
Related
I have updated React Native from v0.61.4 to v0.62.2 to try and use Flipper.
When I build and run the app The Metro Bundler throws the warning:
The native module for Flipper seems unavailable. Please verify that react-native-flipper is installed as yarn dependency to your project and, for iOS, that pod install is run in the ios directory.
I have installed it using npm.
My package.json looks like this:
"dependencies": {
"react": "16.13.1",
"react-native": "0.62.2",
"react-native-flipper": "^0.45.0",
"react-redux": "^7.1.3",
"redux": "^4.0.4",
"redux-flipper": "^1.2.0",
"redux-thunk": "^2.3.0",
...
In Flipper, React DevTools can connect to the app but when I try to use the Hermes Debugger or plugins they cannot be used:
When I run this:
adb shell am start -n com.app/com.facebook.flipper.android.diagnostics.FlipperDiagnosticActivity
I get this error:
Error type 3
Error: Activity class {com.app/com.facebook.flipper.android.diagnostics.FlipperDiagnosticActivity} does not exist.
What could be the reason for the modules not installing correctly?
I have been using /programming react native app since last 2 months.
Always it used to work fine , I could code and run the simulator on my iphone . The environment details are as follows:
EXPO --version 3.1.2 , npm -v 6.9.0, node -v12.4.0
Suddenly, yesterday when I started the project by command 'expo start' it did not start, got a message expo is not installed. Hence I installed expo cli.
Now I typed the command 'expo start', however it gives error
It opens the Metro builder but stops with error
I am unable to start the project and continue coding the app
I tried following troubleshooting :
removed 'node_modules' folder , re-installed 'npm install'
however the same issue persists.
Expected:
The project should start , I should be able to run the simulator in phone
Actual:
The project did not start with 'expo start'
Microsoft Windows [Version 10.0.17134.1006]
(c) 2018 Microsoft Corporation. All rights reserved.
C:\Users\Jituni>cd C:\Users\Jituni\bholmentorworld
C:\Users\Jituni\bholmentorworld>expo start
Starting project at C:\Users\Jituni\bholmentorworld
Expo DevTools is running at http://localhost:19002
Opening DevTools in the browser... (press shift-d to disable)
Error: Can't find react-native in package.json dependencies
Error: React Native is not installed. Please run `npm install` in your project directory.
Couldn't start project. Please fix the errors and restart the project.
Set EXPO_DEBUG=true in your env to view the stack trace.
this is the dependencies.
{
"dependencies": {
"eslint": "^6.2.1",
"expo": "^33.0.0",
"firebase": "^6.4.0",
"react": "16.8.3",
"react-dom": "^16.8.6",
"react-native-gesture-handler": "^1.2.2",
"react-native-reanimated": "^1.0.1",
"react-native-web": "^0.11.4",
"react-navigation": "^3.11.1"
}
}
you hadn't installed the react-native in your dependencies.
SOLUTION
you should make the new project with expo-cli.
FIRST, run this command -> expo init projectname
at this step, select the blank project selection.
then you can see the generated project.
SECOND, merge the dependencies. and then run npm install or yarn install.
LAST, run react-native project with npm start or yarn start.
I'm following this tutorial:
https://blog.expo.io/building-a-react-native-app-using-expo-and-typescript-part-1-a81b6970bb82
yarn global add create-react-native-app
create-react-native-app my-app-name
cd my-app-name
yarn start
I am on the same network as my phone (Android). No VPN. I am in the root folder of my app. It says Loading dependency graph, done. so I know it's running.
Firewall is also off for this as well and this is not a timeout error.
When I scan the QR code:
Something went wrong. Could not load exp://10.0.0.21:19000.
What could be my issue?
EDIT
New error: Uncaught Error: java.net.ConnectException: Failed to connect to /10.0.0.21.19000
Try opening the debugger in chrome and then select tunnel if your device and the development pc are not connected to the same server.
Try the Enter URL manually option
First make sure you are on the same wifi ( computer || laptop and mobile device)
Second open cmd and run command ipconfig their you will get IPv4 Address copy it
Go to your expo go app tap on Enter URL manually
Enter exp://your_IPv4_Address:19000 ( Example -- exp://192.168.1.38:19000 )
Connect now -- It should work
In my case, I used tunnel and there was a problem with the sdk version - I have 39.0.0 and I should use only 36, 37 or 38 - that is the message that i have got from expo, so all I did is to get into the app.json file, and add the following line in expo (or just change it if it already exist):
"sdkVersion": "38.0.0"
and it should look like:
"expo": {
"name": "DoneWithIt",
"slug": "DoneWithIt",
"sdkVersion": "38.0.0",
"version": "1.0.0",
....
....
}
In the package.json file in dependencies, change the version to 38.0.0 in "expo" and "react-native" :
"dependencies": {
"expo": "~38.0.0",
"expo-status-bar": "~1.0.2",
"react": "16.13.1",
"react-dom": "16.13.1",
"react-native": "https://github.com/expo/react-native/archive/sdk-
38.0.0.tar.gz",
"react-native-web": "~0.13.12"
}
then run:
cd yourAppName
npm start
and it will be loaded on your phone.
you can watch it from here:
https://www.youtube.com/watch?v=eS8VULijAZ4
In this video he uses 32.0.0 so be aware to the updated version (in my case 38.0.0 was good for 09/2020)
Just delete the node_modules folder from your application and then run npm install to get the dependencies.
Now run expo start or npm start, the QR code will load now.
On node v12.18. In the package.json downgrade expo and react-native connector. 38 works instead of 40.
"expo": "~38.0.0",
"react-native": "https://github.com/expo/react-native/archive/sdk-38.0.0.tar.gz",
Then remove node_modules and reinstall them
rm -rf node_modules
npm install
then run again :
npm start
QR should work this time
I had this problem after and expo update. Instead of running
npm/yarn start
(executes expo start --dev-client)
Try
npm run run
(executes expo start)
run the command
expo start --tunnel
I am developing a React Native app. My code is error free, but it is facing build problems. I get an error in the Metro Bundler when I execute the command react-native run-android. The error says:
UnhandledPromiseRejectionWarning: Failed to start watch mode.
I also tried adding Watchman to node_modules using the command $yarn add watchman.
I get a prompt that it is deprecated.
How should I solve the error?
My package.json contains the following:
"dependencies": {
"expo": "^25.0.0",
"native-base": "^2.3.7",
"react": "16.2.0",
"react-native": "0.52.0",
"react-native-vector-icons": "^4.5.0",
"react-navigation": "^1.0.0-beta.27",
"watchman": "^1.0.0"
}
"devDependencies": {
"babel-jest": "22.1.0",
"babel-preset-react-native": "4.0.0",
"jest": "22.1.3",
"react-test-renderer": "16.2.0"
}
To have watchman in windows do the following:
(1)Download watchman zip file from the link here
(2) Unzip the folder
(3) Place the watchman.exe file in the folder that is registered in the PATH (environment variable) (Eg: Place the watchman.exe file in C:/ProgramFiles/ and make sure the PATH = 'C:/ProgramFiles')
Done! You would never face this error again!
I have also faced the same issue.Then I have
Deleted the node modules and installed them again by using npm install.
Then clean gradle by '.\gradlew'
Then run the app by 'npx react-native run-android'.
The above steps helped me to resolve the error.
You have to install watchman using brew:
brew install watchman
in windows npm install watchman
I tried the following:
Restarting my system
Deleting npm/yarn cache.
Most of the times the above methods worked but not always. So, here's one-time permanent solution (for Windows)
Download the Watchman v2021.01.11
Unzip, Rename the folder "Watchman" and paste the C:/Program Files.
Open the folder and copy the location of bin folder (would be C:/Program Files/Watchman/bin)
Go to Environment variables, search of PATH variable and append the copied location of bin
same issue I got on metro Android
I tried the following Steps:-
1.npx react-native start --reset-cache
2.cd android && ./gradlew clean && cd..
3.npx react-native run-android
In mac, I used
watchman watch-del-all
on Terminal
then I re-run the XCode. It's working
Failed to start Watchman watch mode (Windows)
I tried a lot to fixed the issue and at last, I restart my windows now it's working.
I'm using expo with react native. All is fine, but i get this warning and the app takes a long time in loading :
[exp] Warning: Not using the Expo fork of react-native. See https://docs.expo.io/.
How can i fix it please.
If you create a react native app with the command from the getting started page: $create-react-native-app AwesomeProject then the package.json file has the following dependencies:
"dependencies": {
"expo": "^20.0.0",
"react": "16.0.0-alpha.12",
"react-native": "^0.47.0"
}
If you create an app directly in the Expo XDE, you will see in the package.json, they use a fork of react-native:
"dependencies": {
"expo": "^20.0.0",
"react": "16.0.0-alpha.12",
"react-native": "https://github.com/expo/react-native/archive/sdk-20.0.0.tar.gz"
},
Changing the react-native module path to https://github.com/expo/react-native/archive/sdk-20.0.0.tar.gz and running npm install will fix the problem.
That's how I fixed it:
I updated my "react-native" dependency to the latest one available:
"https://github.com/expo/react-native/archive/sdk-23.0.0.tar.gz"
I removed all dependency that I had installed by mistake in my previous expo app that actually required react-native link using the npm uninstall --save command:
react-native-image-to-base64,
react-native-cloudinary
Then I also had to remove them from the General > Linked Frameworks and Libraries
Now it works! I'm having issues with the Facebook Login now but at least it doesn't crash my app.
Good luck to you.