Module not found: Error: Can't resolve 'p-queue' after updating to 7.1.0

[rakhadkz]

6.6.2 => 7.1.0
I've found a pretty similar issue title before, but that one was related to react-scripts start command
It works with the previous Major version. I moved to ESM (replaced requied() to import). Any ideas?

node version 14.x
p-queue 7.1.0

using webpack-dev-server (^3.11.1)

[sindresorhus]

This is not the place to ask for support regarding Webpack or webpack-dev-server. This package works fine with plain Node.js. I would open an issue on Webpack or webpack-dev-server asking for help there.

[CristoMonte]

I have the same problem with parcel on version 7.1.0, but it works fine with version 6.6.2.

[sanwar-oc]

I also have the same problem with 7.1.0 with webpack build. I'm downgrading to 6.6.2.

[bjornlll]

I had the same issue with an expo init-generated React Native app (using Facebook's Metro Bundler, not webpack).

Thanks for the tip! Downgrading to 6.6.2 solved it for me.

[skjnldsv]

@sindresorhus this is an issue with this lib.
Importing with import PQueue from 'p-queue' just fails. Webpack cannot find your export path (latest webpack5, using tons of other esm import and they all work fine)

[JamesGarbaczewski]

Ran into the same issue. Importing
import PQueue from 'p-queue/dist';
worked

[tlgimenes]

I'm having the same problem in here and I think this isn't a problem with this library. I think, however, for compatibility reasons, a "module" field is missing on this lib's package.json so tools like tsdx (that uses rollup) can work fine.

[okbeng03]

Ran into the same issue. Importing
import PQueue from 'p-queue/dist';
worked

The error maybe package not export main entry point

I'm try local, add the main define , it works

[kitsunde]

It indeed runs just fine with plain javascript.

Another issue is that it confuses eslint-plugin-import on import/no-unresolved. Which does resolve when it's p-queue/dist however .esm won't import on that.

This isn't the case with p-all, p-map, or p-throttle, not sure what's different in this module, but my project is only partially esm and it's only maintained for pure esm projects.

[mifi]

Doing some research, it seems that p-queue is different from Sindre's other p-* modules in that p-queue has a build step and exports ./dist/index.js:

p-queue/package.json

Line 9 in c12ec2e

"exports": "./dist/index.js",

Meanwhile the other packages don't have a build step but instead "exports": "./index.js", directly:

• https://github.com/sindresorhus/p-throttle/blob/035a2c2d9f1def7dbbee90939f56a3256f7c5f5d/package.json#L14
• https://github.com/sindresorhus/p-series/blob/212bcf2a0712af8451f90c72f2b2b8006b1c7f60/package.json#L14
• https://github.com/sindresorhus/p-all/blob/cdfa57c7df33a6b097568de091ce57edffad43fd/package.json#L14
• https://github.com/sindresorhus/p-map/blob/66b039b20d362c3d508f15b11dd867638b02f75b/package.json#L14

I'm guessing that webpack and other bundlers, when they don't find a main field, they will fallback to using the default index.js, (see specification here). For all the other packages, this is fine because the file is indeed stored at ./index.js, however for p-queue, the file is stored in ./dist/index.js. Not sure why webpack (and other bundlers) are ignoring the exports directive though. Could be a bug or ambiguity in the specifications. Maybe the projects using p-queue needs to have "type": "module" set?

[kolyasya]

import PQueue from 'p-queue/dist'; worked for me in Meteor app.

This should be documented somehow 🤔

[joao-furtado-SADA]

After wasting hours of my life looking for a solution to this, the only thing that comes to my mind is:

Why the hell JS/TS cannot simply WORK?

I love TS, but it's impressive how you just waste a ton of time chasing around zero-value env-related issues because someone decided that ESM was a good idea.

Sorry for the rant

Back to work

[lightrow]

import PQueue from 'p-queue/dist' no longer works when moduleResolution is NOT set to "Node" (Node16) with react native 0.74

Ok it works, you just need to redeclare the types

// esm.d.ts

declare module 'p-queue/dist' {
    export * from 'p-queue';
    export { default } from 'p-queue';
}

declare module 'p-memoize/dist' {
    export * from 'p-memoize';
    export { default } from 'p-memoize';
}