i'm seeing this error in my react-native app on android before launch. I haven't tested on iOS
this is a copy of my metro
BUNDLE ./index.js
WARN AsyncStorage has been extracted from react-native core and will be removed in a future release. It can now be installed and imported from '#react-native-async-storage/async-storage' instead of 'react-native'. See https://github.com/react-native-async-storage/async-storage
ERROR Error: Unknown named module: "react-native-webrtc"
ERROR Invariant Violation: Module AppRegistry is not a registered callable module (calling runApplication). A frequent cause of the error is that the application entry file path is incorrect.
This can also happen when the JS bundle is corrupt or there is an early initialization error when loading React Native.
ERROR Invariant Violation: Module AppRegistry is not a registered callable module (calling runApplication). A frequent cause of the error is that the application entry file path is incorrect.
This can also happen when the JS bundle is corrupt or there is an early initialization error when loading React Native.
My index.js
/**
* #format
*/
import {AppRegistry} from 'react-native';
import MainProject from './App';
import {name as appName} from './app.json';
import {Provider} from 'react-redux';
import {Provider as PaperProvider} from 'react-native-paper'
import store from './videocall/store'
import 'react-native-gesture-handler'
const AppRedux = () => (
<Provider {...{store}}>
<PaperProvider>
<MainProject />
</PaperProvider>
</Provider>
)
AppRegistry.registerComponent(appName, () => AppRedux);
Already tried the answer here , didn't work.
This is package.json
"react": "17.0.1",
"react-native": "0.64.0",
"react-native-peerjs": "^1.0.4",
"react-native-webrtc": "1.89.1
Realized it only occurs on 1.89.1
downgrading to 1.84.1 worked for me
Related
I was running my project well but suddenly this error start to appear:
Logs for your project will appear below.
Error: Unable to resolve module ./index from C:\Users\mateu\OneDrive\Documentos\React JS\Projetos\sleeper-app\sleeper-app-v1\sleeper-app/.: None of these files exist: * index(.native|.android.ts|.native.ts|.ts|.android.tsx|.native.tsx|.tsx|.android.js|.native.js|.js|.android.jsx|.native.jsx|.jsx|.android.json|.native.json|.json) * index\index(.native|.android.ts|.native.ts|.ts|.android.tsx|.native.tsx|.tsx|.android.js|.native.js|.js|.android.jsx|.native.jsx|.jsx|.android.json|.native.json|.json) at ModuleResolver.resolveDependency (C:\Users\mateu\OneDrive\Documentos\React JS\Projetos\sleeper-app\sleeper-app-v1\sleeper-app\node_modules\metro\src\node-haste\DependencyGraph\ModuleResolution.js:136:15) at DependencyGraph.resolveDependency (C:\Users\mateu\OneDrive\Documentos\React JS\Projetos\sleeper-app\sleeper-app-v1\sleeper-app\node_modules\metro\src\node-haste\DependencyGraph.js:231:43) at C:\Users\mateu\OneDrive\Documentos\React JS\Projetos\sleeper-app\sleeper-app-v1\sleeper-app\node_modules\metro\src\lib\transformHelpers.js:129:24 at Server._resolveRelativePath (C:\Users\mateu\OneDrive\Documentos\React JS\Projetos\sleeper-app\sleeper-app-v1\sleeper-app\node_modules\metro\src\Server.js:1107:12) at Server.requestProcessor [as _processBundleRequest] (C:\Users\mateu\OneDrive\Documentos\React JS\Projetos\sleeper-app\sleeper-app-v1\sleeper-app\node_modules\metro\src\Server.js:450:37) at Server._processRequest (C:\Users\mateu\OneDrive\Documentos\React JS\Projetos\sleeper-app\sleeper-app-v1\sleeper-app\node_modules\metro\src\Server.js:406:9)
The weird part is that I actually have an index.js file and I did not any change in it:
My index.js file contains this:
import 'react-native-gesture-handler'
import { registerRootComponent } from 'expo';
import TrackPlayer from 'react-native-track-player';
import App from './App';
// registerRootComponent calls AppRegistry.registerComponent('main', () => App);
// It also ensures that whether you load the app in Expo Go or in a native build,
// the environment is set up appropriately
registerRootComponent(App);
// AppRegistry.registerComponent(...);
TrackPlayer.registerPlaybackService(() => require('./service'));
I tried to reinstall all the packages, clean the node_modules, upgrade the expo, clean the gradle, reset the cache by using expo r -c, stop my onedrive, restart my computer and nothing works
There is probably something wrong with my OneDrive. I took my app folder out of the /OneDrive folder and it worked.
I use this boilerplate. I nearly got React Native working on my Android device. But somehow it fails in the last step because it does not find an index.js file. But that file is located in my project.
So when I now run this in src/
yarn react-native run-android
this is the Node CLI window:
So my issue is:
Error: Unable to resolve module `./index` from ``:
None of these files exist:
* index(.native|.android.js|.native.js|.js|.android.json|.native.json|.json|.android.ts|.native.ts|.ts|.android.tsx|.native.tsx|.tsx)
From the console itself I cannot see any issue:
So somehow it does not find the index.js file for some reason.
I already tried yarn react-native start -- --reset-cache but it did not change anything.
Edit #1:
When I add a fake empty index.js file on root folder, the error is gone and in the emulator I get this one:
Edit #2:
I'm getting nearer to a solution. I just added this to the fake index.js in the root:
import {AppRegistry} from 'react-native';
import App from './src/components/App';
import {name as appName} from './src/app.json';
AppRegistry.registerComponent(appName, () => App);
and there I got:
Edit #3:
Now it helped me to overwrite the app.json with the following:
{
"name": "test",
"displayName": "test"
}
and new error is:
Edit #4:
I now moved all back to the src folder. So in the root there is no index.js anymore. Now this works pretty good. The usual react-scripts start is running. Also react-native start runs. And the issue with run-android was fixed with this in the MainApplication.java
protected String getJSMainModuleName() {
return "index.android";
}
to
protected String getJSMainModuleName() {
return "src/index.android";
}
I think this is another issue with the location...
So the main issue is fixed relatively easy. All that needs to be done is having a placeholder App.js file and another index.js file. How to do that in detail here. Here is the short description:
First move your existing App.js file to src/App.js.
Now create a new App.js in the main folder:
import React from 'react';
import HybridApp from './src/App';
const App = (props) => {
return (
<HybridApp />
);
}
export default App;
Also create a new src/index.js file:
import React from 'react';
import ReactDom from 'react-dom';
import App from './App';
ReactDom.render(<App />, document.getElementById("root"));
And all the other issues are related to using the wrong technology. Like you cannot use window in React Native. Here the code needs to be rewritten to be working again.
I am trying to upload image to firebase storage with react native. I fail in very beginning. I am near the end of my game project and this is only part that is missing.
I have added
new ImagePickerPackage(),
new RNFetchBlobPackage()
and also
import com.imagepicker.ImagePickerPackage;
import com.RNFetchBlob.RNFetchBlobPackage;
to MainApplication.java
Every time I run react-native run-android then I get this message:
C:\Users\Hai\Desktop\projectHQ2\HaalariQuiz\android\app\src\main\java\com\manager\MainApplication.java:7:
error: package com.imagepicker does not exist import
com.imagepicker.ImagePickerPackage;
^ C:\Users\Hai\Desktop\projectHQ2\HaalariQuiz\android\app\src\main\java\com\manager\MainApplication.java:8:
error: package com.RNFetchBlob does not exist import
com.RNFetchBlob.RNFetchBlobPackage;
^ C:\Users\Hai\Desktop\projectHQ2\HaalariQuiz\android\app\src\main\java\com\manager\MainApplication.java:30:
error: cannot find symbol
new ImagePickerPackage(),
^ symbol: class ImagePickerPackage
C:\Users\Hai\Desktop\projectHQ2\HaalariQuiz\android\app\src\main\java\com\manager\MainApplication.java:31:
error: cannot find symbol
new RNFetchBlobPackage()
I just cannot understand the error or what I am doing wrong.
Besides adding the dependencies to MainApplication.java, you also need to add to build.gradle and settings.gradle.
Follow https://github.com/wkh237/react-native-fetch-blob/wiki/Manually-Link-Package to link the package for android.
Follow https://github.com/react-community/react-native-image-picker/blob/develop/README.md#install for image picker
I've been working on a react-native app and have been running it on both IOS and Android simulators as well as on devices in debug mode.
I've packaged it and signed release versions in preparation for putting into the app store and play stores.
The IOS version seems to work fine, but the Android apk gives me the following error:
"redux-persist: cannot process cyclical state. Consider changing your state structure to have no cycles. Alternatively blacklist the corresponding reducer key. Cycle encountered at key "/feed" with value "[object Object]"."
Can anyone tell me what this means and how to fix it?
I'm using redux-persist and ex-navigation for routing in my main app file as follows:
<Provider store={ store }>
<NavigationProvider context={ navigationContext }>
<StackNavigation id="root" navigatorUID="root" initialRoute={ Router.getRoute('splash') } />
</NavigationProvider>
</Provider>
and my init-store file:
import { AsyncStorage } from 'react-native';
import { createStore, applyMiddleware, compose } from 'redux';
import { createNavigationEnabledStore } from '#exponent/ex-navigation';
import thunkMiddleware from 'redux-thunk';
import devTools from 'remote-redux-devtools';
import { persistStore, autoRehydrate } from 'redux-persist';
import rootReducer from './reducers/';
const createStoreWithNavigation = createNavigationEnabledStore({
createStore,
navigationStateKey: 'navigation'
});
export function initStore (initialState) {
return createStoreWithNavigation(
rootReducer,
initialState,
compose(
applyMiddleware(thunkMiddleware),
autoRehydrate({ log: true }),
devTools()
)
);
}
error
I seem to consistently be getting an error similar to below whenever I reach this specific point when working w/ React Native apps.
I create an /App folder with an AppContainer.js file I create a functional component in app/index.js (App & app are two different directories) which renders the AppContainer component. app/index.js looks like this.
import React from 'react'
import { AppContainer } from '~/containers'
export default function SnapshelfApp (props) {
return (
<AppContainer />
)
}
I export AppContainer in containers/index.js
export AppContainer from './App/AppContainer'
It seems like always around this point I get an error saying it's unable to resolve the module and gives me some weird route that doesn't exist.
In iOS I've had this issue and I run react-native start --reset-cache and that solves the issue. I tried the same thing w/ Android but still getting the same error.
I'm also using babel-root-import but my babelrc file is setup fine so I don't see that being the issue.
My project structure is below. The error seems to be skipping over the /app directory.
Any suggestions?