Next-pwa: Next 10.0.6 , Build Error: Cannot find module 'webpack'

[meotimdihia]

Summary

Next 10.0.6 , Build Error: Cannot find module 'webpack'

• C:\sources\anode_modules\workbox-webpack-plugin\build\generate-sw.js
• C:\sources\anode_modules\workbox-webpack-plugin\build\index.js
• C:\sources\anode_modulesnext-pwa\index.js
• C:\sources\anext.config.js
• C:\sources\anode_modulesnext\distnext-server\server\config.js
• C:\sources\anode_modulesnext\dist\build\index.js
• C:\sources\anode_modulesnext\dist\clinext-build.js
• C:\sources\anode_modulesnext\dist\binnext

How To Reproduce

yarn build with.:

• next: 10.0.6, 10.0.7
• next-pwa ^5.0.3

[otekdo]

I also have this problem too!
The same exact response as you mentioned!
I had to downgrade to Next 10.0.5!

[champseo2017]

I also have this problem too!

[srijanshetty]

Same issues with my builds in GitHub Actions. This does not happen with local cached builds, but a new build always fails.

[ReeceM]

So I just updated, and I have the same issue.

But when trying to clear node_modules, package-lock.json and reinstalling, this is the following:

npm WARN [email protected] requires a peer of webpack@>=2 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of webpack@* but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of webpack@>=4.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of webpack@^4.4.0 || ^5.9.0 but none is installed. You must install peer dependencies yourself.

So, am I reading this correctly that nothing is installing web pack by default and that it's up to the end user to manage this bit?

Aside

I recall having this moving to version 10.0.5 last time, but cannot recall what actually fixed it.

[Divlo]

This issue also has been reported to vercel/next.js repo : https://github.com/vercel/next.js/issues/21679
@otekdo Indeed downgrading to [email protected] solves the issue but it would be better to fix the issue with latest version of next.

Currently next-pwa depends of webpack in peerDependencies : https://github.com/shadowwalker/next-pwa/blob/9dc7c26716a1e5c20755f532fbc112501a463ce9/package.json#L27-L30

Maybe this commit is related : https://github.com/vercel/next.js/commit/099cd30b36cbd1dc3be6e3f9966a607100ea7dd4#diff-9c1a3867443c54525b4f24ef171f231a6e8bb065ffc8b7b62c4843d5ff62dd42L106-L108

Could be cool, if we find a solution for latest version of next.

[otekdo]

@Divlo Thanks for the tip!
but right now, i'll keep it to 10.0.5, i'll wait for the solution
i do not really need 10.0.6, i updated because there could be some perfomance optimization or other stuff!

[shadowwalker]

Try to add webpack with following command should help fix this issue:

yarn add webpack@webpack-4

[Divlo]

@shadowwalker It solves the issue, but in my opinion next or next-pwa should handle this for us (users), as it was the case with [email protected]. We should not handle a webpack version in our devDependencies.
I don't know from where the error is coming from, and I don't know the codebase of this library, but I guess it's solvable without adding extra-dependencies for the users.

[carloscuesta]

Totally agree with @Divlo that's something that next or next-pwa should handle.

If I'm not mistaken, I think that what's happening here is that next-pwa assumes that webpack is a dependency that is satisfied by next that's why it's working at 10.0.5

[ReeceM]

I do believe that next-pwa uses workbox, and that is requiring webpack directly in the code that is throwing the error.

I don't think this repo directly depends on it, but rather only has it as a development dependency, and is relying on the fact that the end user is using webpack and so is the workbox package.

NextJS appears to have made the dependency of webpack handled internally and that removed the _natrual_ availability of the webpack package.

I see that there are requirements for peer dependencies in this package for webpack, and I think the workbox one when installing.

@shadowwalker Is there the intention that the end user needs to have workbox installed? Or was it being statisfied as a requirement when NextJS was supplying Webpack and that the user initially didn't notice? (myself included)

[qipoy]

I have no idea what's going on with webpack. I just roll back from [email protected] to [email protected] until this issue solved.

[shadowwalker]

next.js should includes webpack and next-pwa will use that. This is how it works before, I'm not sure what's going on with latest changes and webpack 5 updates. Still investigating.

[ReeceM]

next.js should includes webpack and next-pwa will use that. This is how it works before, I'm not sure what's going on with latest changes and webpack 5 updates. Still investigating.

@shadowwalker what I noticed, between 10.0.6 canary-0 (this canary build works) and canary-1 webpack was removed as a dependency of nextjs and changed to an internally built and managed instance, so all referenced webpack instances that they used were changed to one under a dist directory.

The thing that I noticed is that with next-pwa the error comes mainly from the workbox package as it requires an instance of web pack but still declares it under devDependencies So it isn’t really ever added in a end users node_modules folder.

I am not sure if there is a way to reference the nextjs version and then declare it for workbox to find. But that would cause a similar issue as now. So that would be bad idea.

[timneutkens]

Posted an explanation here: https://github.com/vercel/next.js/issues/21679#issuecomment-771941447

[BjoernRave]

With the help of the explanation of @timneutkens I got it to work by adding require('webpack') to next.config.js and installing webpack@4 as dependency

[timmalstead-cfa]

I can confirm that the solution from @timneutkens and @BjoernRave works.

In my case, it was necessary to keep next at 10.0.5 and next-pwa at 5.0.3 and then install [email protected] under devDependencies.

Thanks so much!

[jatinhemnani01]

so should I downgrade my next version to 10.0.5 ?

[shadowwalker]

@timneutkens I read your comments here https://github.com/vercel/next.js/issues/21679#issuecomment-771941447, but still couldn't figure out what I should change in next-pwa to minimize the impact for the users of next.js 10.0.6 and next-pwa plugin. Could you provide some more advice on this issue? Thanks.

[digitaltim-de]

Same problem..

[ReeceM]

As I had the issue coming from this package and next.js combined, the following was a solution: https://github.com/vercel/next.js/issues/21679#issuecomment-774652496

It seems that it will have to do until 10.0.7 of next.js comes out

[tarun1992]

I am also facing the same issue. Is there any solution as Webpack solution didn't work for me.

[ReeceM]

I am also facing the same issue. Is there any solution as Webpack solution didn't work for me.

@tarun1992 maybe try Tim Neutkens suggestion as there is a patch in the canary version of nextjs, https://github.com/vercel/next.js/issues/21679#issuecomment-778112748

[Divlo]

I tried https://github.com/vercel/next.js/issues/21679#issuecomment-778112748
So I use [email protected] and [email protected] with npm@6 because with npm@7 the installation fails because the peer dependency are unmet.

But it isn't working, I still got the error :

Error: Cannot find module 'webpack'
Require stack:
- /home/divlo/Documents/Thream/website/node_modules/workbox-webpack-plugin/build/generate-sw.js
- /home/divlo/Documents/Thream/website/node_modules/workbox-webpack-plugin/build/index.js
- /home/divlo/Documents/Thream/website/node_modules/next-pwa/index.js

...
etc.

[natbatwat]

Facing the same issue with next 10.0.7

[leerle56]

Facing the same issue with next 10.0.7

I have fixed it by install webpack@4 in 10.0.7...

[Gilson401]

Facing the same issue with next 10.0.1 (!)

[dcateflexera]

I am still getting this issue with next v 10.0.7.

I added a next.config.js file to the root of the repo and the following code produces the error:

const withLess = require('@zeit/next-less')
  module.exports = withLess({
   /* config options here */
})

[carloscuesta]

The issue is fixed at Next 10.0.8, upgraded today from 10.0.5 and had no problems!

Fixed at: https://github.com/vercel/next.js/pull/22583

[meotimdihia]

Yes, I think we can close this issue now.

[shadowwalker]

Great, glad the issue is fixed with next.js 10.0.8. Please create a new issue if there are other concerns.

[Hocdoc]

I have to remove node_modules. After that, this error dissapeared:

rm -rf node_modules/
npm install
npm run build