Vue add vuetify breaks webpack serve

[Tzahile]

Version

5.0.0-alpha.2

Reproduction link

https://github.com/Tzahile/vueCLI5-vuetify

Environment info

System:
    OS: Windows Server 2016 10.0.14393
    CPU: (4) x64 Intel(R) Core(TM) i7-6500U CPU @ 2.50GHz
  Binaries:
    Node: 15.5.1 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.22.5 - C:\Program Files (x86)\Yarn\bin\yarn.CMD
    npm: 6.14.10 - ~\AppData\Roaming\npm\npm.CMD
  Browsers:
    Chrome: 87.0.4280.141
    Edge: Not Found
  npmPackages:
    @vue/babel-helper-vue-jsx-merge-props:  1.2.1
    @vue/babel-helper-vue-transform-on:  1.0.0
    @vue/babel-plugin-jsx:  1.0.1
    @vue/babel-plugin-transform-vue-jsx:  1.2.1
    @vue/babel-preset-app:  5.0.0-alpha.2
    @vue/babel-preset-jsx:  1.2.4
    @vue/babel-sugar-composition-api-inject-h:  1.2.1
    @vue/babel-sugar-composition-api-render-instance:  1.2.4
    @vue/babel-sugar-functional-vue:  1.2.2
    @vue/babel-sugar-inject-h:  1.2.2
    @vue/babel-sugar-v-model:  1.2.3
    @vue/babel-sugar-v-on:  1.2.3
    @vue/cli-overlay:  5.0.0-alpha.2
    @vue/cli-plugin-babel: ~5.0.0-alpha.2 => 5.0.0-alpha.2
    @vue/cli-plugin-e2e-cypress: ~5.0.0-alpha.2 => 5.0.0-alpha.2
    @vue/cli-plugin-eslint: ~5.0.0-alpha.2 => 5.0.0-alpha.2
    @vue/cli-plugin-router: ~5.0.0-alpha.2 => 5.0.0-alpha.2
    @vue/cli-plugin-unit-jest: ~5.0.0-alpha.2 => 5.0.0-alpha.2
    @vue/cli-plugin-vuex: ~5.0.0-alpha.2 => 5.0.0-alpha.2
    @vue/cli-service: ~5.0.0-alpha.2 => 5.0.0-alpha.2
    @vue/cli-shared-utils:  5.0.0-alpha.2
    @vue/component-compiler-utils:  3.2.0
    @vue/eslint-config-prettier: ^6.0.0 => 6.0.0
    @vue/preload-webpack-plugin:  1.1.2
    @vue/test-utils: ^1.0.3 => 1.1.2
    @vue/web-component-wrapper:  1.2.0
    eslint-plugin-vue: ^7.2.0 => 7.4.1
    jest-serializer-vue:  2.0.2
    vue: ^2.6.11 => 2.6.12
    vue-cli-plugin-vuetify: ~2.0.9 => 2.0.9
    vue-eslint-parser:  7.3.0
    vue-hot-reload-api:  2.3.4
    vue-jest:  3.0.7
    vue-loader:  16.1.2 (15.9.6)
    vue-router: ^3.4.3 => 3.4.9
    vue-style-loader:  4.1.2
    vue-template-compiler: ^2.6.11 => 2.6.12
    vue-template-es2015-compiler:  1.9.1
    vuetify: ^2.2.11 => 2.4.2
    vuetify-loader: ^1.3.0 => 1.6.0
    vuex: ^3.6.0 => 3.6.0
  npmGlobalPackages:
    @vue/cli: Not Found

Steps to reproduce

From scratch (otherwise, if working from repo attached above, just $npm run serve):
$ vue create new-project - Set some environment you like.
When finished:
$ cd vueCLI5-vuetify && npm install && npm run serve - So far, so good.
$ vue add vuetify - Choose the recommended setup.

$ npm run serve - now won't work

What is expected?

Webpack should run normally

What is actually happening?

ERROR Error: Cannot find module 'webpack/lib/RuleSet'

---

Full PS logs

PS C:\Projects\vueCLI5-vuetify> vue add vuetify
📦 Installing vue-cli-plugin-vuetify...

• vue-cli-plugin-vuetify@2.0.9
  added 7 packages from 9 contributors and audited 1990 packages in 25.619s

109 packages are looking for funding
run npm fund for details

found 0 vulnerabilities

✔ Successfully installed plugin: vue-cli-plugin-vuetify

? Choose a preset: Default (recommended)

🚀 Invoking generator for vue-cli-plugin-vuetify...
📦 Installing additional dependencies...

added 3 packages from 2 contributors and audited 1993 packages in 24.954s

110 packages are looking for funding
run npm fund for details

found 0 vulnerabilities

⚓ Running completion hooks...

✔ Successfully invoked generator for plugin: vue-cli-plugin-vuetify
vuetify Discord community: https://community.vuetifyjs.com
vuetify Github: https://github.com/vuetifyjs/vuetify
vuetify Support Vuetify: https://github.com/sponsors/johnleider

PS C:\Projects\vueCLI5-vuetify> npm run serve

vueCLI5-vuetify@0.1.0 serve C:\Projects\vueCLI5-vuetify
vue-cli-service serve

ERROR Error: Cannot find module 'webpack/lib/RuleSet'
Require stack:

• C:\Projects\vueCLI5-vuetify\node_modules\vuetify-loader\lib\plugin.js
• C:\Projects\vueCLI5-vuetify\node_modules\vue-cli-plugin-vuetify\index.js
• C:\Projects\vueCLI5-vuetify\node_modules@vue\cli-service\lib\Service.js
• C:\Projects\vueCLI5-vuetify\node_modules@vue\cli-service\bin\vue-cli-service.js
  Error: Cannot find module 'webpack/lib/RuleSet'
  Require stack:
• C:\Projects\vueCLI5-vuetify\node_modules\vuetify-loader\lib\plugin.js
• C:\Projects\vueCLI5-vuetify\node_modules\vue-cli-plugin-vuetify\index.js
• C:\Projects\vueCLI5-vuetify\node_modules@vue\cli-service\lib\Service.js
• C:\Projects\vueCLI5-vuetify\node_modules@vue\cli-service\bin\vue-cli-service.js
  at Function.Module._resolveFilename (node:internal/modules/cjs/loader:925:15)
  at Function.Module._resolveFilename (C:\Projects\vueCLI5-vuetify\node_modules\module-alias\index.js:49:29)
  at Function.Module._load (node:internal/modules/cjs/loader:769:27)
  at Module.require (node:internal/modules/cjs/loader:997:19)
  at require (node:internal/modules/cjs/helpers:92:18)
  at Object. (C:\Projects\vueCLI5-vuetify\node_modules\vuetify-loader\lib\plugin.js:1:17)
  at Module._compile (node:internal/modules/cjs/loader:1108:14)
  at Object.Module._extensions..js (node:internal/modules/cjs/loader:1137:10)
  at Module.load (node:internal/modules/cjs/loader:973:32)
  at Function.Module._load (node:internal/modules/cjs/loader:813:14)
  npm ERR! code ELIFECYCLE
  npm ERR! errno 1
  npm ERR! vueCLI5-vuetify@0.1.0 serve: vue-cli-service serve
  npm ERR! Exit status 1
  npm ERR!
  npm ERR! Failed at the vueCLI5-vuetify@0.1.0 serve script.
  npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\tc02993\AppData\Roaming\npm-cache_logs\2021-01-11T15_19_04_977Z-debug.log

[sodatea]

vuetify-loader hasn't supported webpack 5 yet vuetifyjs/vuetify-loader#136.
In this case, please run vue add webpack-4.

[Tzahile]

I upgraded mainly for Webpack v.5 😅
If it depends on vuetify-loader, maybe I should move the issue there?
After all, at some point they need to support it.

[sodatea]

Yeah there are two ongoing PRs already: vuetifyjs/vuetify-loader#166 vuetifyjs/vuetify-loader#165

[Peque]

@Tzahile You can now install vuetify-loader@^1.7.3 to fix the issue. 😊