Babel: plugin-proposal-optional-chaining is missing?

[bdotsamir]

Hello! Having a strange issue!

I'm following the recommended installation path for this package; I installed react-native-reanimated and specified in my package.json that it should install v2.x.x. Yarn is telling me that the version installed is 2.17.0. I made sure to run cd ios && pod install to properly link the project if expo install react-native-reanimated didn't already do it. I also installed react-native-svg according to this project's package.json (greater than or equal to 12.1.1, I just put in 12.x.x which gave me 12.5.1). Here's my full package.json if you're interested.

Even following the recommended installation steps, I'm getting a strange babel error when bundling the application via expo start -c:

error: node_modules/react-native-circular-progress-indicator/src/circularProgress/index.tsx: /Volumes/stickbug/projectname/node_modules/react-native-circular-progress-indicator/src/circularProgress/index.tsx: Cannot find module '@babel/plugin-proposal-optional-chaining'
Require stack:
- /Volumes/stickbug/projectname/node_modules/@babel/core/lib/config/files/plugins.js
- /Volumes/stickbug/projectname/node_modules/@babel/core/lib/config/files/index.js
- /Volumes/stickbug/projectname/node_modules/@babel/core/lib/index.js
- /Volumes/stickbug/projectname/node_modules/react-native-reanimated/plugin.js
- /Volumes/stickbug/projectname/node_modules/metro-react-native-babel-transformer/node_modules/@babel/core/lib/config/files/module-types.js
- /Volumes/stickbug/projectname/node_modules/metro-react-native-babel-transformer/node_modules/@babel/core/lib/config/files/configuration.js
- /Volumes/stickbug/projectname/node_modules/metro-react-native-babel-transformer/node_modules/@babel/core/lib/config/files/index.js
- /Volumes/stickbug/projectname/node_modules/metro-react-native-babel-transformer/node_modules/@babel/core/lib/index.js
- /Volumes/stickbug/projectname/node_modules/metro-react-native-babel-transformer/src/index.js
- /Volumes/stickbug/projectname/node_modules/metro-transform-worker/src/index.js
- /Volumes/stickbug/projectname/node_modules/metro/src/DeltaBundler/Worker.flow.js
- /Volumes/stickbug/projectname/node_modules/metro/src/DeltaBundler/Worker.js
- /Volumes/stickbug/projectname/node_modules/jest-worker/build/workers/processChild.js
- Did you mean "@babel/plugin-transform-optional-chaining"?

Make sure that all the Babel plugins and presets you are using
are defined as dependencies or devDependencies in your package.json
file. It's possible that the missing plugin is loaded by a preset
you are using that forgot to add the plugin to its dependencies: you
can workaround this problem by explicitly adding the missing package
to your top-level package.json.

I even went as far as to install @babel/plugin-proposal-nullish-coalescing-operator and @babel/plugin-proposal-optional-chaining then adding them both to my babel.config.js only to be met with an error suggesting that react-native-reanimated wasn't properly linked.. and so I ran cd ios && pod install, which went fine, but then I ran expo run:ios and reanimated failed with a strange templating error.

I tried also to just install this package and obviously that didn't work.

Truly have no idea what to do here. Let me know if I'm doing something wrong 👀