Implement dynamic module import in React Native Expo

Question

If my React Native Expo app (running within an Expo Go app) currently does an import/from

import Foo, {Bar} from "foo";

How can I convert this into a dynamic import that only imports when a certain condition is met, such as when hello === "world"?

The following actions will cause the application to crash with the error non-std C exception.

if (hello === "world") {
    import Foo, {Bar} from "foo";
}

Tried the following workaround but still results in a crash with non-std C exception:

if (hello === "world") {
    const Foo = import('foo')
    const Bar = Foo.Bar
}

Answer 1

You can use the import() function to load modules asynchronously. Here is an example:

let Foo;
let Bar;

if (hello === "world") {
  import("foo").then((module) => {
    Foo = module.default;
    Bar = module.Bar;
  });
}

In this code, the import() function returns a promise that resolves to a module object. The default property of the module object is assigned to the Foo variable, and the Bar property of the module object is assigned to the Bar variable.

It should be noted that the import() function is asynchronous, so any code that relies on imported modules should be placed in the then() callback function. Additionally, you should ensure that any code that relies on imported modules is only executed after the module has been loaded.