Error [ERR_UNSUPPORTED_DIR_IMPORT] on latest version of MSW (even when the project is not "type": "module")

Prerequisites

• I confirm my issue is not in the opened issues
• I confirm the Frequently Asked Questions didn’t contain the answer to my issue

Environment check

• I’m using the latest msw version
• I’m using Node.js version 14 or higher

Node.js version

16.18

Reproduction repository

https://github.com/AleskiWeb/mswjs-next

Reproduction steps

I know there is a lot of discussion in issues here on the project relating directly to ESM support, however I don’t think I am trying to use this as a module but still keep running up against the same error.

Happy to be told otherwise! I am just lost with the steps to get me out of this tailspin.

Furthermore, using https://github.com/vercel/next.js/tree/canary/examples/with-msw also has the same error in the console

The above repository was made using the simple setup instructions from the nextjs docs, followed by an implementation of the MSW docs (currently mocking nothing but the error still persists)

• Clone the project
• yarn
• yarn dev
• visit localhost:3000

Current behavior

• There is an error in the terminal relating to ESM and index.mjs

ready - started server on 0.0.0.0:3000, url: http://localhost:3000
event - compiled client and server successfully in 735 ms (160 modules)
wait  - compiling / (client and server)...
event - compiled client and server successfully in 713 ms (429 modules)
error - unhandledRejection: Error [ERR_UNSUPPORTED_DIR_IMPORT]: Directory import '/Users/NAME/projects/mswjs-next/node_modules/@mswjs/interceptors/lib/interceptors/ClientRequest' is not supported resolving ES modules imported from /Users/NAME/projects/mswjs-next/node_modules/msw/lib/node/index.mjs
Did you mean to import @mswjs/interceptors/lib/interceptors/ClientRequest/index.js?

Expected behavior

• I should be hitting the index.js in the lib/node/ folder

[vnglst]

If you’re looking for a quick/temporary fix for usage with next.js, you can force next to NOT use ESM modules in packages.

/** @type {import("next").NextConfig} */
module.exports = {
  experimental: {
    esmExternals: false,
  },
}

See: https://github.com/vercel/next.js/issues/40904

[harm-meijer]

@AleskiWeb Can you tell me what version of msw is this and what version will still work? I tried specifically with 0.47.2 but still have that error