Next-pwa: Build Error since 5.1

Created on 5 Apr 2021  路  8Comments  路  Source: shadowwalker/next-pwa

Summary

I was running without error in 5.0.6 and after upgrading to 5.1.3 I'm getting a webpack error

Screenshots

image

bug

Most helpful comment

Added terser-webpack-plugin in version 5.2.5

All 8 comments

Same here. Running yarn add terser-webpack-plugin solved it. I think that the webpack-terser-plugin should be added to next-pwa's dependencies.

Which next.js version you are using when you see the error?

As I tested custom-ts-worker example in gitpod (which is a fresh environment), it builds completely fine. Without specifying future.webpack5: true or install terser-webpack-plugin specifically.

I'd recommend you try upgrade next.js, remove .next, yarn.lock, node_modules, then install and build again to resolve the problem. Otherwise, install terser-webpack-plugin on the user's side is fairly easy to solve the problem.

I just tried a full clean and install and experience the same error.
I deleted both my node_modules, .next, and package-lock.json and did an npm i

"dependencies": {
    "next": "10.1.3",
    "next-pwa": "^5.2.1"
}

next.config:

const withPWA = require("next-pwa");
module.exports = withPWA({
  pwa: {
    disable: process.env.NODE_ENV === "development",
    register: false,
    skipWaiting: false,
    dest: "public"
  }
});
> Build error occurred
Error: Cannot find module 'terser-webpack-plugin'
Require stack:
- MYDIR\node_modules\next-pwa\build-custom-worker.js
- MYDIR\node_modules\next-pwa\index.js
- MYDIR\next.config.js
- MYDIR\node_modules\next\dist\next-server\server\config.js
- MYDIR\node_modules\next\dist\build\index.js
- MYDIR\node_modules\next\dist\cli\next-build.js- MYDIR\node_modules\next\dist\bin\next
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:880:15)
    at Function.mod._resolveFilename (MYDIR\node_modules\next\dist\build\webpack\require-hook.js:4:1784)
    at Function.Module._load (internal/modules/cjs/loader.js:725:27)
    at Module.require (internal/modules/cjs/loader.js:952:19)
    at require (internal/modules/cjs/helpers.js:88:18)
    at Object.<anonymous> (MYDIR\node_modules\next-pwa\build-custom-worker.js:7:22)
    at Module._compile (internal/modules/cjs/loader.js:1063:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1092:10)
    at Module.load (internal/modules/cjs/loader.js:928:32)
    at Function.Module._load (internal/modules/cjs/loader.js:769:14)
    at Module.require (internal/modules/cjs/loader.js:952:19)
    at require (internal/modules/cjs/helpers.js:88:18)
    at Object.<anonymous> (MYDIR\node_modules\next-pwa\index.js:10:27)
    at Module._compile (internal/modules/cjs/loader.js:1063:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1092:10)
    at Module.load (internal/modules/cjs/loader.js:928:32) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    'MYDIR\\node_modules\\next-pwa\\build-custom-worker.js',
    'MYDIR\\node_modules\\next-pwa\\index.js',
    'MYDIR\\next.config.js',
    'MYDIR\\node_modules\\next\\dist\\next-server\\server\\config.js',
    'MYDIR\\node_modules\\next\\dist\\build\\index.js',
    'MYDIR\\node_modules\\next\\dist\\cli\\next-build.js',
    'MYDIR\\node_modules\\next\\dist\\bin\\next'
  ]
}
npm ERR! code ELIFECYCLE

In my case I'm using Next.js ^10.1.3 with the future.webpack5 flag enabled, prior to 5.1 everything worked normally, after the update the build fails

Snap same issue, I feel we shouldn't have to install extra dependencies as part of this package. If you really must then add it as a peer dependency

Added terser-webpack-plugin in version 5.2.5

It works with my production app now, thanks so much!

Thanks @shadowwalker the issue has been solved 鉂わ笍

Was this page helpful?
0 / 5 - 0 ratings

Related issues

vishwasnavadak picture vishwasnavadak  路  8Comments

loyep picture loyep  路  3Comments

yhay81 picture yhay81  路  5Comments

mohammadgarmroodi picture mohammadgarmroodi  路  5Comments

paales picture paales  路  3Comments