Vitest require() of ES Module @azure/msal-react thirdy party package

The issue

Recently, I migrated from CRA 'jest' to Vitest, but I'm getting the following error:


require() of ES Module <path>\rush\common\temp\node_modules\.pnpm\@azure+msal-react@2.0.22_r\node_modules\@azure\msal-react\dist\index.js from <path>\rush\packages\auth\dist\index.js not supported.

Instead change the require of <path>\rush\common\temp\node_modules\.pnpm\@azure+msal-react@2.0.22_r\node_modules\@azure\msal-react\dist\index.js in <path>\rush\packages\auth\dist\index.js to a dynamic import() which is available in all CommonJS modules.

The package azure/msal-react is being used by a third-party package, meaning I import package X, and package X imports the @azure/msal-react library,

I have my vite.config.ts file configured with the test attributes as follows:

export default defineConfig(async ({ mode }) => {
   //...code

return {
    //...code
    test: {
       environment: 'jsdom',
       globals: true,
       setupFiles: ['./src/setupTests.ts'],
    }
}

I've already tried using an alias and server.deps.inline: ['@azure/msal-react'], but nothing worked.

I configured Jest in another environment, and it can be 'bypassed' by mocking with jest.mock("@azure/msal-react"); or by adding the package to moduleNameMapper/transformIgnorePatterns.

However, mocking with vi.mock("@azure/msal-react"); doesn't work, and @azure/msal-react don't have a .mjs file to set an alias :')

Does anyone have any idea how to resolve this?

Solution

It was a configuration error on my part.

When I imported the package, I was getting the file from /dist/index.js, which resulted in the error that require() is not an ES module. What I did was update the package being imported (I have access to the package) and added the exports property in the package's package.json to point to /dist/index.esm.js

"exports": {
    ".": {
        "import": "./dist/index.esm.js",
        "require": "./dist/index.js",
        "types": "./dist/index.d.ts"
    }
},