'yarn run:host:android' show only loading page.

[JeehoonLim]

Ask your Question

Hello. I tried to execute your showcase without standalone . I open 3 terminals and execute like below, but what I can see is only the loading page.

Term 1: yarn yarn start Term 2: yarn adbreverse Term 3: yarn run:host:android

Do I need something more to run the superapp and miniapps?

[thymikee]

You will also need to run the catalog-server and auth module:

yarn concurrently -P "yarn start:catalog" "yarn start:auth"

Does that work for you?

[JeehoonLim]

When I execute the comand, It gives me errors like below:

[0] Error: listen EADDRINUSE: address already in use :::3000 ... [0] yarn start:catalog exited with code 1 [1] error listen EADDRINUSE: address already in use ::1:9003.

I guess the cause is that first command 'yarn start' already run the catalog-server and auth module:

PS C:\work\repack\super-app-showcase> yarn start [catalog] [CatalogServer] Server listening at port 3000

[trancongdung12]

any update? same issue when run app

[aravindle]

any update? same issue when run app

same here

[jbroma]

Hi everyone,

I've recently updated Re.Pack and CodeSigning configuration, please check whether this resolves your issues!

Regarding the commands, the only commands you should need for running the app on Android should be this:

yarn start                 # starts all the devservers
yarn run:host:android      # builds the app for android & starts the emulator
yarn adbreverse            # enables connection via ports needed by the devservers

One word of advice - you need to run yarn adbreverse after the emulator has started, otherwise it will have no effect.

[keila66]

Im having this same issue when running app on Windows 11. Any possible solution?

[quangtruongdit]

Hi all, I have got the issue with run the app on Android device as below, seems the Auth module does not get bundle correctly. Do you guys have same issue?

` ⇢ [03:01:01.815Z][LoggerPlugin] Compiling android: 26% building (3/10 entries 192/234 dependencies 13/106 modules) ⇢ [03:01:04.198Z][LoggerPlugin] Compiling android: 31% building (4/10 entries 826/1000 dependencies 87/290 modules) ⇢ [03:01:05.884Z][LoggerPlugin] Compiling android: 32% building (4/10 entries 1631/1700 dependencies 126/450 modules) ⇢ [03:01:08.153Z][LoggerPlugin] Compiling android: 32% building (4/10 entries 2113/2200 dependencies 187/543 modules) ⇢ [03:01:09.921Z][LoggerPlugin] Compiling android: 32% building (4/10 entries 2717/3000 dependencies 287/597 modules) ⇢ [03:01:12.506Z][LoggerPlugin] Compiling android: 32% building (4/10 entries 2898/3139 dependencies 318/600 modules) ⇢ [03:01:13.890Z][LoggerPlugin] Compiling android: 65% building (14/14 entries 3908/3908 dependencies 762/762 modules) node:internal/event_target:1010 process.nextTick(() => { throw err; }); ^

Error: ENOENT: no such file or directory, open '/Users/../reactnative/rn-super-app/packages/auth/build/generated/android/vendors-node_modules_pmmmwh_react-refresh-webpack-plugin_lib_runtime_RefreshUtils_js.chunk.bundle' Emitted 'error' event on Compiler instance at: at Worker. (/Users/.../reactnative/rn-super-app/packages/auth/node_modules/@callstack/repack/dist/webpack/Compiler.js:110:14) at Worker.emit (node:events:513:28) at MessagePort. (node:internal/worker:233:53) at [nodejs.internal.kHybridDispatch] (node:internal/event_target:735:20) at exports.emitMessage (node:internal/per_context/messageport:23:28) `

I temporary removed the 'auth' from the host app, then I am able to run this app with the 'booking' module.

Thanks

[quangtruongdit]

Ask your Question

Hello. I tried to execute your showcase without standalone . I open 3 terminals and execute like below, but what I can see is only the loading page.

Term 1: yarn yarn start Term 2: yarn adbreverse Term 3: yarn run:host:android

Do I need something more to run the superapp and miniapps?

Please try to remove "AuthProvider" in the host/src/App.tsx. Seems 'auth' module has some issue with bundling.

Try return this component only. `return ( <NavigationContainer onReady={() => RNBootSplash.hide({ fade: true, duration: 500 })}>

          </NavigationContainer>
        );`

[aravindd7]

Hi all, I have got the issue with run the app on Android device as below, seems the Auth module does not get bundle correctly. Do you guys have same issue?

` ⇢ [03:01:01.815Z][LoggerPlugin] Compiling android: 26% building (3/10 entries 192/234 dependencies 13/106 modules) ⇢ [03:01:04.198Z][LoggerPlugin] Compiling android: 31% building (4/10 entries 826/1000 dependencies 87/290 modules) ⇢ [03:01:05.884Z][LoggerPlugin] Compiling android: 32% building (4/10 entries 1631/1700 dependencies 126/450 modules) ⇢ [03:01:08.153Z][LoggerPlugin] Compiling android: 32% building (4/10 entries 2113/2200 dependencies 187/543 modules) ⇢ [03:01:09.921Z][LoggerPlugin] Compiling android: 32% building (4/10 entries 2717/3000 dependencies 287/597 modules) ⇢ [03:01:12.506Z][LoggerPlugin] Compiling android: 32% building (4/10 entries 2898/3139 dependencies 318/600 modules) ⇢ [03:01:13.890Z][LoggerPlugin] Compiling android: 65% building (14/14 entries 3908/3908 dependencies 762/762 modules) node:internal/event_target:1010 process.nextTick(() => { throw err; }); ^

Error: ENOENT: no such file or directory, open '/Users/../reactnative/rn-super-app/packages/auth/build/generated/android/vendors-node_modules_pmmmwh_react-refresh-webpack-plugin_lib_runtime_RefreshUtils_js.chunk.bundle' Emitted 'error' event on Compiler instance at: at Worker. (/Users/.../reactnative/rn-super-app/packages/auth/node_modules/@callstack/repack/dist/webpack/Compiler.js:110:14) at Worker.emit (node:events:513:28) at MessagePort. (node:internal/worker:233:53) at [nodejs.internal.kHybridDispatch] (node:internal/event_target:735:20) at exports.emitMessage (node:internal/per_context/messageport:23:28) `

I temporary removed the 'auth' from the host app, then I am able to run this app with the 'booking' module.

Thanks

What all steps did u take to remove auth from the host app. Could you please tell me as I am trying to boot this project since few weeks.

[quangtruongdit]

. Could you

There are 2 things I did:

1. Create a pem file called 'code-signing.pem' and place it in root folder
2. Go to ./packages/host/src/App.tsx, then remove the 'AuthProvider" Your code in App.tsx now is:

`import React from 'react'; import RNBootSplash from "react-native-bootsplash"; import {Federated} from '@callstack/repack/client'; import {NavigationContainer} from '@react-navigation/native'; import MainNavigator from './navigation/MainNavigator'; import SplashScreen from './components/SplashScreen'; import ErrorBoundary from './components/ErrorBoundary';

const AuthProvider = React.lazy(() => Federated.importModule('auth', './AuthProvider'), ); const SignInScreen = React.lazy(() => Federated.importModule('auth', './SignInScreen'), );

const App = () => { return ( <NavigationContainer onReady={() => RNBootSplash.hide({ fade: true, duration: 500 })}>

</NavigationContainer>

); };

export default App; `

3. Follow the readme and start app as normal

At root folder:

• yarn
• yarn start
• yarn run:host:android
• yarn adbreverse

Hope it helps

[umer4081]

Im having this same issue when running app please any new update here!!

[aravindd7]

Im having this same issue when running app please any new update here!!

I shifted to Linux OS and could get the app to work based on inputs from all issue threads

[umer4081]

I'm not getting your point could you please explain!

---

From: Aravind Dammu @.> Sent: 09 September 2023 15:48 To: callstack/super-app-showcase @.> Cc: Umer Majeed @.>; Comment @.> Subject: Re: [callstack/super-app-showcase] 'yarn run:host:android' show only loading page. (Issue #49)

Im having this same issue when running app please any new update here!!

I shifted to Linux OS and could get the app to work based on inputs from all issue threads

— Reply to this email directly, view it on GitHubhttps://github.com/callstack/super-app-showcase/issues/49#issuecomment-1712476867, or unsubscribehttps://github.com/notifications/unsubscribe-auth/BCI73N5D3QERBBU7PXGS5UDXZQ66LANCNFSM6AAAAAAZ4L7TYY. You are receiving this because you commented.Message ID: @.***>

[umer4081]

[JeehoonLim]

I should share my current status. I could see the app screens when I execute on Macbook env, failed with windows env.

< History of my work > I use 3 environment for this showcase

Env 1: Old Windows Laptop ( For 1st try ) It stucked with loading page. --> I assume the problem is due to lack of resources.

Env 2: New Windows Laptop I could pass the 'Loading page issue'. But the app show me ESM Loader error like #63.

_[host] Error [ERR_UNSUPPORTED_ESM_URLSCHEME]: Only URLs with a scheme in: file, data, and node are supported by the default ESM loader. On Windows, absolute paths must be valid file:// URLs. Received protocol 'c:'

I received recent branch from the repository, but the problem was not solved. I think this problem is related to this reapck issue.

Env3: (Old) Macbook Finally, I could see the app screens. In fact, when first execution of every app - host ans mini app -, It shows me the error page. But second request - after build complete, it works well.

[aravindd7]

Same with me(env3 case)

[bharath-doijode]

I also had the same show only loading page issue. Now it is resolved by changing to below environment

Node Version: v18.11.0 repack module version: "@callstack/repack": "~3.7.0", OS: mac

[Akshayn777]

Hey, I facing the issue like , When I try to run the react native app. I can able to install the app and I can also able to see the splash screen. but somehow the development server disconnects. Please give me a solution. node version :21.0.0

PC : Windows

[bharath-doijode]

Please downgrade the node version to 18.x.x and try

[Havanika28]

hi, @bharath-doijode Downgrading the version dint work. I am still seeing the same callstack screen. Please help.