ESLint: Package subpath './browser' is not defined by "exports"

[Grohden]

Yo, great docs about the upgrade, I think I have the same frustrations with jest/jsdom that the authors have found... but the docs helped at lot!

But one thing that didn't work here is eslint, I have two errors with it, the first being:

ESLint: Unable to resolve path to module 'msw/browser'.(import/no-unresolved)

and the second is:

ESLint: 
Resolve error: Error [ERR_PACKAGE_PATH_NOT_EXPORTED]: Package subpath './browser' is not defined by "exports" in [my-path]/node_modules/msw/package.json
    at exportsNotFound (node:internal/modules/esm/resolve:303:10)
    at packageExportsResolve (node:internal/modules/esm/resolve:593:13)
    at resolveExports (node:internal/modules/cjs/loader:591:36)
    at Module._findPath (node:internal/modules/cjs/loader:668:31)
    at findModulePath ([my-path]/node_modules/eslint-import-resolver-alias/index.js:99:27)
    at exports.resolve ([my-path]/node_modules/eslint-import-resolver-alias/index.js:75:10)
    at withResolver ([my-path]/node_modules/eslint-module-utils/resolve.js:114:23)
    at fullResolve ([my-path]/node_modules/eslint-module-utils/resolve.js:135:22)
    at relative ([my-path]/trusted-web/node_modules/eslint-module-utils/resolve.js:84:10)
    at resolve ([my-path]/node_modules/eslint-module-utils/resolve.js:216:12)
(import/namespace)

I can fix them with

/* eslint-disable */
import { setupWorker } from 'msw/browser';
/* eslint-enable */

But I'm curious if there's a better solution...I imagine this has something to do with esm shenanigans?

[kettanaito]

Hi, @Grohden.

Is that a custom eslint rule/plugin by any chance? I remember seeing a popular one that has some trouble resolving conditional exports in package.json.

MSW does define the ./browser export right here:

msw/package.json

Line 16 in 93d9f86

"./browser": {

So the original error from eslint makes little sense. Try researching around that particular rule and see if you find any issues related to it. This has to be addressed on the eslint configuration level.

[SYNTEC-10101927]

I have the same problem. Disable the eslint rule does not help with the situation. My vue project will fail on serve.

[SYNTEC-10101927]

update: I have a Error Message:

 error  Resolve error: Package subpath './browser' is not defined by "exports" in Path\To\My\Project\node_modules\msw\package.json

[kettanaito]

Please submit a reproduction repository. I'd be happy to help once you do.

[Grohden]

@kettanaito I've managed to make a reproduction

https://github.com/Grohden/msw-cli-issue/tree/chore/lint-issue

And it seems that the problem is with eslint-import-resolver-alias, which is the 'import/resolver' setting in .eslintrc

its weird that its only happening with msw.. but I guess that the issue is in this mentioned package

[ianwalter]

I get the same error in a Next.js app. If I remove the highlighted section from the msw package.json and change the default to .mjs it works 🤷🏽

Solved it by adding to my next.config.js:

      resolve: {
        ...config.resolve,
        alias: {
          ...config.resolve.alias,
          ...(process.env.NEXT_PUBLIC_ENABLE_MOCKING === 'true'
            ? { 'msw/browser': path.join(__dirname, 'node_modules/msw/lib/browser/index.mjs') }
            : { 'msw/browser': false }),
        },
      },

[lkarmelo]

I use Vite and ran into this issue today. I fixed it by adding this code to root of my eslint config

  settings: {
    'import/resolver': {
      alias: {
        map: [
          ['msw/browser', './node_modules/msw/browser']
        ],
      }
    }
  }