[bug]: Error: Cannot find module 'workbox-build/build/options/schema/webpack-generate-sw'

Describe the bug

It seems that after releasing v.11.0.0 the tutorials are not working anymore. Many yarn commands are failing, such as watch, build

I follow the current tutorial: https://github.com/magento/pwa-studio/blob/develop/pwa-devdocs/src/tutorials/pwa-studio-fundamentals/project-setup/index.md

After executing yarn create @magento/pwa and cd into the folder the execution of yarn watch fails with the following error:

yarn run v1.22.10
$ webpack-dev-server --progress --color --env.mode development
internal/modules/cjs/loader.js:883
  throw err;
  ^

Error: Cannot find module 'workbox-build/build/options/schema/webpack-generate-sw'
Require stack:
- /home/michael/PWA/frontend/node_modules/workbox-webpack-plugin/build/generate-sw.js
- /home/michael/PWA/frontend/node_modules/workbox-webpack-plugin/build/index.js
- /home/michael/PWA/frontend/node_modules/@magento/pwa-buildpack/lib/WebpackTools/plugins/ServiceWorkerPlugin.js
- /home/michael/PWA/frontend/node_modules/@magento/pwa-buildpack/lib/WebpackTools/configureWebpack/getClientConfig.js
- /home/michael/PWA/frontend/node_modules/@magento/pwa-buildpack/lib/WebpackTools/configureWebpack/configureWebpack.js
- /home/michael/PWA/frontend/node_modules/@magento/pwa-buildpack/lib/WebpackTools/configureWebpack/index.js
- /home/michael/PWA/frontend/node_modules/@magento/pwa-buildpack/lib/WebpackTools/index.js
- /home/michael/PWA/frontend/node_modules/@magento/pwa-buildpack/lib/index.js
- /home/michael/PWA/frontend/webpack.config.js
- /home/michael/PWA/frontend/node_modules/webpack-cli/bin/convert-argv.js
- /home/michael/PWA/frontend/node_modules/webpack-dev-server/bin/webpack-dev-server.js
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:880:15)
    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> (/home/michael/PWA/frontend/node_modules/workbox-webpack-plugin/build/generate-sw.js:20:33)
    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> (/home/michael/PWA/frontend/node_modules/workbox-webpack-plugin/build/index.js:10:20)
    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) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    '/home/michael/PWA/frontend/node_modules/workbox-webpack-plugin/build/generate-sw.js',
    '/home/michael/PWA/frontend/node_modules/workbox-webpack-plugin/build/index.js',
    '/home/michael/PWA/frontend/node_modules/@magento/pwa-buildpack/lib/WebpackTools/plugins/ServiceWorkerPlugin.js',
    '/home/michael/PWA/frontend/node_modules/@magento/pwa-buildpack/lib/WebpackTools/configureWebpack/getClientConfig.js',
    '/home/michael/PWA/frontend/node_modules/@magento/pwa-buildpack/lib/WebpackTools/configureWebpack/configureWebpack.js',
    '/home/michael/PWA/frontend/node_modules/@magento/pwa-buildpack/lib/WebpackTools/configureWebpack/index.js',
    '/home/michael/PWA/frontend/node_modules/@magento/pwa-buildpack/lib/WebpackTools/index.js',
    '/home/michael/PWA/frontend/node_modules/@magento/pwa-buildpack/lib/index.js',
    '/home/michael/PWA/frontend/webpack.config.js',
    '/home/michael/PWA/frontend/node_modules/webpack-cli/bin/convert-argv.js',
    '/home/michael/PWA/frontend/node_modules/webpack-dev-server/bin/webpack-dev-server.js'
  ]
}
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

To reproduce

Steps to reproduce the behavior:

yarn watch

Expected behavior

Run developer and production mode successfully

Screenshots

If applicable, add screenshots to help explain your problem.

Possible solutions

Add any ideas about possible solutions to the problem here.

Debug Report

yarn build:report is also failing with the same error.

Please complete the following device information:

• OS: Ubuntu 20.04
• Magento Version [e.g Magento Commerce 2.4]: 2.4.1

[Glenn-Domin]

Turns out updating everything workbox-related to 6.2.4 fixed it.

[Glenn-Domin]

I’m actually getting the same thing happening, both with and without the resolution bit added (I came to this after the snippet was already in there). My package.json

{
  "name": "test",
  "private": true,
  "version": "0.0.1",
  "description": "A new project based on @magento/venia-concept",
  "license": "UNLICENSED",
  "scripts": {
    "buildpack": "buildpack",
    "build": "npm run build:prod",
    "build:analyze": "npm run clean && mkdir dist && webpack -p --profile --no-progress --env.mode production --json > dist/build-stats.json && webpack-bundle-analyzer dist/build-stats.json",
    "build:dev": "npm run clean && webpack --no-progress --env.mode development",
    "build:prod": "npm run clean && webpack --no-progress --env.mode production",
    "build:report": "buildpack generate-build-report",
    "clean": "rimraf dist",
    "lint": "eslint --ignore-path .gitignore 'src/**/{*.js,package.json}'",
    "prettier": "prettier --loglevel warn --ignore-path .gitignore 'src/**/*.@(css|graphql|js)' '*.js'",
    "prettier:check": "npm run -s prettier -- --check",
    "prettier:fix": "npm run -s prettier -- --write",
    "start": "buildpack serve .",
    "start:debug": "node --inspect-brk ./node_modules/.bin/webpack-dev-server --progress --color --env.mode development",
    "watch": "webpack-dev-server --progress --color --env.mode development",
    "storybook": "start-storybook -p 9001 -c src/.storybook",
    "storybook:build": "build-storybook -c src/.storybook -o storybook-dist"
  },
  "main": "src/index.js",
  "browser": {
    "@magento/venia-drivers": "src/drivers"
  },
  "dependencies": {
    "@magento/pwa-buildpack": "~10.0.0"
  },
  "devDependencies": {
    "@adobe/apollo-link-mutation-queue": "~1.0.2",
    "@apollo/client": "~3.1.2",
    "@babel/core": "~7.3.4",
    "@babel/plugin-proposal-class-properties": "~7.3.4",
    "@babel/plugin-proposal-object-rest-spread": "~7.3.4",
    "@babel/plugin-syntax-dynamic-import": "~7.2.0",
    "@babel/plugin-syntax-jsx": "~7.2.0",
    "@babel/plugin-transform-react-jsx": "~7.3.0",
    "@babel/plugin-transform-runtime": "~7.4.4",
    "@babel/preset-env": "~7.3.4",
    "@babel/runtime": "~7.4.2",
    "@magento/babel-preset-peregrine": "~1.1.0",
    "@magento/eslint-config": "~1.5.0",
    "@magento/pagebuilder": "~6.0.0",
    "@magento/peregrine": "~11.0.0",
    "@magento/upward-security-headers": "~1.0.4",
    "@magento/venia-ui": "~8.0.0",
    "@pmmmwh/react-refresh-webpack-plugin": "0.4.1",
    "@storybook/react": "~6.1.14",
    "@wojtekmaj/enzyme-adapter-react-17": "~0.4.1",
    "apollo-cache-persist": "~0.1.1",
    "babel-core": "~7.0.0-bridge.0",
    "babel-eslint": "~10.0.1",
    "babel-jest": "~24.1.0",
    "babel-loader": "~8.0.5",
    "babel-plugin-dynamic-import-node": "~2.2.0",
    "babel-plugin-graphql-tag": "~2.0.0",
    "babel-plugin-module-resolver": "~3.2.0",
    "braintree-web-drop-in": "~1.16.0",
    "compression": "~1.7.4",
    "css-loader": "~2.1.1",
    "dotenv": "~6.2.0",
    "enzyme": "~3.11.0",
    "eslint": "~5.14.1",
    "eslint-plugin-babel": "~5.3.0",
    "eslint-plugin-graphql": "~3.0.3",
    "eslint-plugin-jsx-a11y": "~6.2.1",
    "eslint-plugin-node": "~8.0.1",
    "eslint-plugin-package-json": "~0.1.3",
    "eslint-plugin-react": "~7.21.5",
    "eslint-plugin-react-hooks": "~2.0.1",
    "express": "~4.16.4",
    "file-loader": "~4.0.0",
    "graphql": "~15.3.0",
    "html-webpack-plugin": "~3.2.0",
    "informed": "~3.27.0",
    "jarallax": "~1.11.1",
    "load-google-maps-api": "~2.0.1",
    "lodash": "~4.17.20",
    "lodash.escape": "~4.0.1",
    "lodash.get": "~4.4.2",
    "lodash.over": "~4.7.0",
    "lodash.set": "~4.3.2",
    "memoize-one": "~5.0.0",
    "memory-fs": "~0.4.1",
    "prettier": "~1.16.4",
    "prop-types": "~15.7.2",
    "react": "~17.0.1",
    "react-dom": "~17.0.1",
    "react-intl": "~5.7.0",
    "react-redux": "~7.1.1",
    "react-refresh": "0.8.3",
    "react-router-dom": "~5.1.0",
    "react-slick": "~0.25.2",
    "react-tabs": "~3.0.0",
    "react-test-renderer": "~17.0.1",
    "redux": "~4.0.1",
    "redux-actions": "~2.6.4",
    "redux-thunk": "~2.3.0",
    "rimraf": "~2.6.3",
    "style-loader": "~2.0.0",
    "terser-webpack-plugin": "~1.2.3",
    "uuid": "~3.3.2",
    "webpack": "~4.46.0",
    "webpack-bundle-analyzer": "~3.3.2",
    "webpack-cli": "~3.2.3",
    "webpack-dev-server": "~3.2.1",
    "workbox-cacheable-response": "~6.0.2",
    "workbox-core": "~6.0.2",
    "workbox-expiration": "~6.0.2",
    "workbox-precaching": "~6.0.2",
    "workbox-routing": "~6.0.2",
    "workbox-strategies": "~6.0.2",
    "workbox-webpack-plugin": "~6.0.2"
  },
  "optionalDependencies": {
    "sharp": "~0.23.3"
  },
  "resolutions": {
    "workbox-build": "~6.0.2"
  },
  "engines": {
    "node": ">=10.x",
    "yarn": ">=1.12.0"
  },
  "pwa-studio": {
    "targets": {
      "intercept": "./local-intercept.js"
    }
  }
}