I'm trying to create my first Capacitor Plugin for an Ionic app. I used the command
npm init #capacitor/plugin
to generate it. Then following the instructions here I opened the android folder in Android Studio. My file though has several import errors that I can't figure out how to fix.
Hovering the red text I get the error:
Cannot resolve symbol 'JSObject'
I haven't changed anything from the generated version. I've tried Invalidating Caches and Restarting as well as Clean Project. I have very little experience in Java and creating Andriod Apps. All I know is there there is an import error, but why if the plugin is freshly generated?
You are following capacitor 3 docs but testing on a capacitor 2 project
I am working with npm expo and android studios, and I am trying to retrieve data from an exciting project in firebase. Thus I am following this tutorial .
when I was added to the project I had android studios installed already so I just installed expo and I was working on the app. I never needed the file build.Gradle, but now I need it for the firebase installation and I cant not find it. when I open my project directory, I cant see anything about Gradle, and since I had never worked with expo I am wodeirng if I have to generate a build.gradle file or not? and if so how can I do that exactly, Also I am workign win 10.
===
I have added google-services.json to my app folder but I cant go any further since I cant find build.gradle!
SO i figured it out, based on this stackoverflow question, I was also missing the android folder, but then the solution was to do a
expo eject
command in the cli and then it will make the android folder as well, and the I have access to build.gradle.
When I use npx react-native run-android command to run my project on android the live reload feature doesn't work and I can't even bring up the developer menu using Command + M.
When I run the same project on iOS using npx react-native run-ios everything works fine. What am I doing wrong?
I'm using MacOS 10.15.5 and React native 0.62.2. Not using Expo.
Managed to fix this. There were two issues with my project. Firstly BuildConfig was being imported from react in my MainApplication.java file. According to this post: https://stackoverflow.com/a/43183752/9295598 it should come from my package. Once I resolved this I noticed that my package name didn't match my folder structure. Seem like I renamed my project in the past and didn't update the folder structure.
Once the folder structure was fixed and BuildConfig was imported from my project, the BuildConfig.DEBUG started working as intended which fixed the rest of the issues.
I'm trying to add a Facebook Login on my react native project using react-native-fbsdk library, but I am getting error while running react-native run-android.
Here's the screenshot of the error:
I have clearly followed the installation instructions from their github repo: https://github.com/facebook/react-native-fbsdk
I tried most of the solutions found on SO but couldn't make it run.
I have following versions installed:
react-native#0.47.1
react-native-fbsdk#0.6.0
This is due to breaking change in 0.47.1 which affects most of the native dependencies. In case of react-native-fbsdk, they has yet to release new version. So if you use following version, it would be fine.
react-native : 0.46.4
react-native-fbsdk : 0.6.1
I'm new to react native, and I've been having some trouble understanding the folder structure of the app which should supposedly be present in the project folder on creation. Basically, when creating the project with npm, I get some starting files (App.js etc.) and a node_modules folder. I've got it up and running with expo, which created the .expo folder as well.
However, when I go to react's official documentation or look into plugins/addons on git they talk several times about an android and an iOS folder in the project root. But they are nowhere to be seen. I then got some hints that I could install and run react-native-upgrade-git, which allegedly would generate these missing folders. But that didn't work either.
So what have I missed? Where are those folders located?
Edit: Here is a screen dump from a Youtube tutorial showing the project structure I'm looking for:
One of the points of Expo on top of React Native is that you don't go down to android or ios code. Expo deals with those folders for you, you don't need to interact with them. Is there a reason you need those folders? if so, you will have to eject. Here's the documentation to do so: Ejecting with ExpoKit
You can get to that project structure by running:
npm run eject
However, it removes the app from the Expo framework, which adds a lot of nice benefits and abstraction from the Android/iOS code.
i think if you want to develop app with ReactNative you start follow this : Getting Started use React Native.
If you create project with ReactNative just write on your terminal like:
react-native init YourProjectName
cd YourProjectName
react-native run-ios //for iOS
I hope my answer helping you to create project with ReactNative. thanks..
Check this Expo document Adding custom native code
In general,
to generate ios folder: expo run:ios
to generate android folder: expo run:android
Try this to generate the Android and iOS folder
react-native eject
react-native link
To add to Funk Soul Ninja's answer after following his directions (thank you! :) ), for those who started with an Expo project:
expo run:ios
did the trick for me.
The command creates the ios folder that contains the project that can be edited and built in Xcode.
I did not do this step, but I believe expo run:android does exactly the analogous thing for Android; but I would suggest checking out Expo documentation on adding custom native code.
I think I am little late but follow this steps if you don't want to read any document.
android and ios folder are not present when react native project is created with expo. so you have to detach expo from your project to create android and ios folder.
first add required package name in app.json file
ios: {
bundleIdentifier: "com.yourcompany.yourappname",
},
android: {
package: "com.yourcompany.yourappname",
}
then run below command in terminal
exp detach
after command is successfully executed you will find android and ios folder
Delete folders android and ios
npm i react-native-eject
react-native eject
I had to run expo eject. The story behind why I didn't have the folders is had to downgrade my react-native application because of some broken dependencies and then I got build failures. So I deleted the ios and android folders then ran expo eject and got all the build issues fixed. Note that I used expo command line via a script in package json so that the versions would match the version my project was using.
run this in the root directory
expo eject
in the begining install react native, after run expo init YourProject , choose minimal (Typescript) . after that go to YourProject directory and do not run npm start. but run npm run android. hope this help
This worked for me: Go to Setting and remove both entries "android" and "ios" from "Files:Exclude". Don't forget both environments - User and Workspace.
Removing entries on Workspace:
... same for User:
If you created the project with Expo you will have the Expo folder instead of ios and android folders
If you previously installed a global react-native-cli package, please remove it as it may cause unexpected issues:
npm uninstall -g react-native-cli #react-native-community/cli
then create a new project again:
npx react-native init DemoApp
The simplest way I know
1) Take your app name from your current app.json, let's say the name is "mynativeapp"
2) make a new folder somewhere outside of your current project folder
3) start in it:
react-native init mynativeapp
4) the command above will make android and ios folders internally compatible by name with your project
5) copy android/ios folders into your project folder
Now you can try to start your native project. I checked that for Android:
react-native run-android
enjoy!
P.S. "react": "16.9.0", "react-native": "0.61.4"