Ask your Question

Hi I have done the setup and when I run 'yarn run:host-app:android' i get the error: Property 'webpack_require' doesn't exist.

Environment
Host app
React Native: 0.72.3
Repack: 3.7.0
Webpack: 5.91.0
OS: MacOS 13.6.3 - Chip M1 Pro
Xcode: 15.2

Description
I've cloned your repo, I move into host-app, setup environment callstack/repack. I stop metro and run react-native webpack-start with host is my IP Address but it show this, i think it doesn't receive the webpack local
Thank you.

Here is my index.js

import {AppRegistry} from 'react-native';
import App from './src/App';
import {name as appName} from './app.json';
import {ScriptManager, Federated} from '@callstack/repack/client';

ScriptManager.shared.addResolver(async (scriptId, caller) => {
  const resolveURL = Federated.createURLResolver({
    containers: {
      MiniApp: 'http://localhost:9000/[name][ext]',
    },
  });

  const url = resolveURL(scriptId, caller);
  if (url) {
    return {
      url,
      query: {
        platform: Platform.OS,
      },
    };
  }
});

ScriptManager.shared.on('resolving', (...args) => {
  console.log('DEBUG/resolving', ...args);
});

ScriptManager.shared.on('resolved', (...args) => {
  console.log('DEBUG/resolved', ...args);
});

ScriptManager.shared.on('prefetching', (...args) => {
  console.log('DEBUG/prefetching', ...args);
});

ScriptManager.shared.on('loading', (...args) => {
  console.log('DEBUG/loading', ...args);
});

ScriptManager.shared.on('loaded', (...args) => {
  console.log('DEBUG/loaded', ...args);
});

ScriptManager.shared.on('error', (...args) => {
  console.log('DEBUG/error', '111111111111');
  console.log('DEBUG/error', ...args);
});
AppRegistry.registerComponent(appName, () => App);

Ask your Question

I'm trying to run the app and it throws the error:-
"Unable to load script. Make sure you're either running Metro (run 'npx react-native start') or that your bundle 'index.android.bundle' is packaged correctly for release." right after app starts. Anyway i can fix this. spent a day already on this library

Steps to reproduce.

1. Open host android folder in Android studio
2. Build the android app in release mode
3. install the .apk in physical device
4. open the app.
5. host App is opening as expected
6. try to access mini app from host app
7. app is crashing

I just wanted to know , If I am missing out any steps to build the prod app or this is not the correct way to it .

Thanks in Advance.

I've read your step-by-step guide but I got stuck when tried to install pod

[!] /bin/bash -c
set -e
#!/bin/bash

Copyright (c) Meta Platforms, Inc. and affiliates.

This source code is licensed under the MIT license found in the

LICENSE file in the root directory of this source tree.

set -e

PLATFORM_NAME="${PLATFORM_NAME:-iphoneos}"
CURRENT_ARCH="${CURRENT_ARCH}"

if [ -z "$CURRENT_ARCH" ] || [ "$CURRENT_ARCH" == "undefined_arch" ]; then
# Xcode 10 beta sets CURRENT_ARCH to "undefined_arch", this leads to incorrect linker arg.
# it's better to rely on platform name as fallback because architecture differs between simulator and device

if [[ "$PLATFORM_NAME" == *"simulator"* ]]; then
    CURRENT_ARCH="x86_64"
else
    CURRENT_ARCH="arm64"
fi

fi

@lint-ignore-every TXT2 Tab Literal

if [ "$CURRENT_ARCH" == "arm64" ]; then
cat <<\EOF >>fix_glog_0.3.5_apple_silicon.patch
diff --git a/config.sub b/config.sub
index 1761d8b..43fa2e8 100755
--- a/config.sub
+++ b/config.sub
@@ -1096,6 +1096,9 @@ case $basic_machine in
basic_machine=z8k-unknown
os=-sim
;;

•   arm64-*)
  

•           basic_machine=$(echo $basic_machine | sed 's/arm64/aarch64/')
  

•           ;;
    none)
            basic_machine=none-none
            os=-none
  

EOF

patch -p1 config.sub fix_glog_0.3.5_apple_silicon.patch

fi

export CC="$(xcrun -find -sdk $PLATFORM_NAME cc) -arch $CURRENT_ARCH -isysroot $(xcrun -sdk $PLATFORM_NAME --show-sdk-path)"
export CXX="$CC"

Remove automake symlink if it exists

if [ -h "test-driver" ]; then
rm test-driver
fi

Manually disable gflags include to fix issue facebook/react-native#28446

sed -i.bak -e 's/@ac_cv_have_libgflags@/0/' src/glog/logging.h.in && rm src/glog/logging.h.in.bak
sed -i.bak -e 's/HAVE_LIB_GFLAGS/HAVE_LIB_GFLAGS_DISABLED/' src/config.h.in && rm src/config.h.in.bak

./configure --host arm-apple-darwin

cat << EOF >> src/config.h
/* Add in so we have Apple Target Conditionals */
#ifdef APPLE
#include <TargetConditionals.h>
#include <Availability.h>
#endif

/* Special configuration for ucontext */
#undef HAVE_UCONTEXT_H
#undef PC_FROM_UCONTEXT
#if defined(x86_64)
#define PC_FROM_UCONTEXT uc_mcontext->__ss.__rip
#elif defined(i386)
#define PC_FROM_UCONTEXT uc_mcontext->__ss.__eip
#endif
EOF

Prepare exported header include

EXPORTED_INCLUDE_DIR="exported/glog"
mkdir -p exported/glog
cp -f src/glog/log_severity.h "$EXPORTED_INCLUDE_DIR/"
cp -f src/glog/logging.h "$EXPORTED_INCLU
DE_DIR/"
cp -f src/glog/raw_logging.h "$EXPORTED_INCLUDE_DIR/"
cp -f src/glog/stl_logging.h "$EXPORTED_INCLUDE_DIR/"
cp -f src/glog/vlog_is_on.h "$EXPORTED_INCLUDE_DIR/"

patching file config.sub
1 out of 1 hunks failed--saving rejects to config.sub.rej

I attempted to create a super app from scratch, similar to the sample provided, but I couldn't proceed because of a few challenges.

The steps required to create the super app project from scratch were not listed in any of the callstack documents.

It would be helpful if you could share the steps for creating the super app project structure (in the main branch) from scratch.

I have done setup on my windows system and setup Repack on both host-app and mini-app by following all steps after running on emulator getting following error:

ReferenceError: Property 'HMRClient' doesn't exist
at ./node_modules/@callstack/repack/dist/modules/WebpackHMRClient.js (http://10.0.2.2:8081/index.bundle?platform=android&dev=true&minify=false&app=com.hostapp&modulesOnly=false&runModule=true:1142:7)
at call (native)
at anonymous (http://10.0.2.2:8081/index.bundle?platform=android&dev=true&minify=false&app=com.hostapp&modulesOnly=false&runModule=true:42524:35)
at call (native)
at webpack_require (http://10.0.2.2:8081/index.bundle?platform=android&dev=true&minify=false&app=com.hostapp&modulesOnly=false&runModule=true:41942:37)
at anonymous (http://10.0.2.2:8081/index.bundle?platform=android&dev=true&minify=false&app=com.hostapp&modulesOnly=false&runModule=true:43429:30)
at global (http://10.0.2.2:8081/index.bundle?platform=android&dev=true&minify=false&app=com.hostapp&modulesOnly=false&runModule=true:43433:12)
...