fix empty export on web

[EvanBacon]

Summary

React Native Babel preset uses a loose plugin to convert imports to commonjs, we're investigating switching to a more standard approach in Expo CLI here expo/expo#30005 which aligns with how Metro is used at Meta.

When running on the kitchen sink, I found that there was an invalid expression in reanimated where it exports null and then destructures null. This error didn't occur previously because the commonjs plugin deferred access to the null object until later.

Before

var _Math = _$$_REQUIRE(_dependencyMap[0]);

// Later ...

_Math.add

This coincidentally didn't throw because the deferred code is never accessed.

After

var add = _$$_REQUIRE(_dependencyMap[0]).add;

This throws because the null is accessed when the module is loaded.

Test plan

Bundle a Metro web project with experimentalImportSupport enabled:

config.transformer.getTransformOptions = async () => ({
  transform: {
    experimentalImportSupport: true,
    inlineRequires: false,
  },
});

Then run npx serve dist -> Error was there but not anymore.

[piaskowyk]

Thank you for the fix and detailed description!

[codeion]

Hi,
It's breaking build with vite bundler, maybe to consider this patch...
react-native-reanimated+3.13.0.patch

[djaffer]

WARNING in ./node_modules/react-native-reanimated/lib/module/createAnimatedComponent/createAnimatedComponent.js:265
export 'RNRenderer' (imported as 'RNRenderer') was not found in '../platform-specific/RNRenderer' (module has no exports)
263 | viewConfig = null;
264 | } else {

265 | var hostInstance = RNRenderer.findHostInstance_DEPRECATED(component);
266 | if (!hostInstance) {
267 | throw new Error('[Reanimated] Cannot find host instance for this component. Maybe it renders nothing?');
268 | }