How to apply babel transforms to files from sibling directory in expo project

I have an expo project and some common code in a sibling directory.

I previously had common code in myproject/lib/foo.js and changed it to common/lib/foo.js. It doesn't matter whether I use ../common/lib/foo.js or common/lib/foo.js (with some fancy mapping config, and npm install --save ../common), I get these errors:

During tests I get:

 Warning: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:      1. You might have mismatching versions of React and the renderer (such as React DOM)      2. You might be breaking the Rules of Hooks      3. You might have more than one copy of React in the same app      See https://reactjs.org/link/invalid-hook-call for tips about how to debug and fix this problem.

Probably because common has its own node_modules containing react.

And when running npx expo start and running in a browser, I get:

Uncaught Error: Module parse failed: Unexpected character '@' (24:4)You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file.

This file in question uses decorators (@autobind), so my guess is its not being run through babel or whatever.

I followed this blog post: https://dushyant37.medium.com/how-to-import-files-from-outside-of-root-directory-with-react-native-metro-bundler-18207a348427

And created a metro.config.js like this:

const path = require('path');const { getDefaultConfig } = require('expo/metro-config');const config = getDefaultConfig(__dirname);const commonDir = path.resolve(__dirname +'/../common');const extraNodeModules = {'common': commonDir,};config.resolver.extraNodeModules = new Proxy(extraNodeModules, {  get: (target, name) =>    //redirects dependencies referenced from common/ to local node_modules    name in target ? target[name] : path.join(process.cwd(), `node_modules/${name}`),});config.watchFolders.push(commonDir);module.exports = config;

I even updated tsconfig.json:

{"extends": "expo/tsconfig.base","compilerOptions": {"allowJs": true,"strict": true  },"include": [".*.js","*.js","**/*.js","*.ts","**/*.ts","*.tsx","**/*.tsx","../common/*.ts","../common/**/*.ts","../common/*.tsx","../common/**/*.tsx"  ],"exclude": ["coverage/","node_modules/","web-build/",  ]}

And babel.config.js

module.exports = function (api) {    api.cache(true);    return {        presets: ['babel-preset-expo'],        plugins: [            ['module-resolver', {                alias: {                    kidneykeeper: './src',                    common: '../common',                },            }],            ['transform-inline-environment-variables', {                include: ['NGROK_HOST',                ],            }],'react-native-reanimated/plugin',        ],        env: {            production: {                plugins: ['react-native-paper/babel'],            },            test: {                plugins: ['react-native-paper/babel', 'dynamic-import-node'],            },        },    };};

But I still get the exact same errors.