Where to put polyfills in the new router ?

[Twiggeh]

Hi!
I have the issue that with the new router, the polyfills are not being loaded before the rest of the code is executed.
I import the modules currently at the _layout the index =>

app/
  index.tsx
  _layout.tsx

I have also tried putting it into the index.tsx file, but that didn't seem to make a difference.

_layout.tsx

import "@/comps/polyfillA" // runs after the {something } import
import { something } from "moduleNeedingPolyfill" // runs before first import

it used to be that you could put your polyfills into the index.js file (which worked), but that is now gone, how could I resolve this now ?

I can create an example, but that won't work on snack as it doesn't support the new router yet.

[EvanBacon]

Create an index.js file and make your polyfill the first import:

import 'polyfill'
import 'expo-router/entry'

Then change the main field in the package.json to point to the "main": "./index".

[pooriamo]

I was also struggling with this. I had put it in app/_layout.tsx but after investigation, I realized that that file is loaded after (tabs)/_layout.tsx!
This saved me, thank you. I wish it was documented somewhere.

Also, I'm very curious to know why the loading order is like that.

[salieflewis]

Does anyone know if this pattern would support package instantiation as such?

import 'text-encoding-polyfill'
import { install } from 'react-native-quick-crypto'
import 'expo-router/entry'

install()

[michaelessiet]

Does anyone know if this pattern would support package instantiation as such?

import 'text-encoding-polyfill'
import { install } from 'react-native-quick-crypto'
import 'expo-router/entry'

install()

what I did was call the install function before importing expo entry. Not sure if it makes a difference tho

[salieflewis]

I've had success with this approach, but will play around with the ordering as I still have the occasional issue with RNQC

[Ismailn16]

i'm running into the same issue but when i add in : import 'expo-router/entry' -- It says it cant find the polyfills. when i remove it the app bundles fine but fails to open properly because its not opening to _layout.jsx through expo-router. Does anyone have any ideas or potential solutions?