Q: Jest error "You are loading the ES modules build of React Router on a page that is already running the CommonJS build, so things won't work right." I keep getting this error with react-router-dom.
 FAIL  client/__test__/index.test.tsx
  ● Test suite failed to run

    You are loading the CommonJS build of React Router on a page that is already running the ES modules build, so things won't work right.

      3 | import Error404 from './components/Error/404';
      4 | import Error500 from './components/Error/500';
    > 5 | import { Switch } from 'react-router-dom';
        | ^
      6 |
      7 | import ErrorBoundary from './components/Error/ErrorBoundary';

I am assuming this means that react-router-dom is using CommonJS build and it doesn't like that?
Here's my jest config
module.exports = {
  roots: ['<rootDir>/client/__test__'],
  transform: {
    '^.+\\.(ts)x?$':  ['ts-jest', { useESM: true }]
  },
  testRegex: '(client/__tests__/.*|(\\.|/)(test|spec))\\.[jt]sx?$',
  moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'node'],
  globals: {
    'ts-jest': {
      tsconfig: './client/tsconfig.test.json',
      diagnostics: false,
    },
  },
};

And here's my tsconfig.json
{
  "compilerOptions": {
    "outDir": "build",
    "types": ["jest"],
    "jsx": "react",
  },
  "exclude": ["node_modules", "server_build*", "build*"]
}

I thought this might be a transformation issue. Based on what I read transform is suppose to fix files like this? Here are what I have already tried

*

*Adding in jest.config.js

transform: {
    '^.+\\.(ts)x?$':  ['ts-jest', { useESM: true }]
  },



*

*Adding in jest.config.js

transformIgnorePatterns: ['node_modules/(?!\\.pnpm/@types+react-router-dom@5.3.3/)']


*

*Adding "esModuleInterop": true" in the tsconfig.json.

