Error when building new app: Cannot find module

[jmiguelzambrana]

Enviroment

Win10 Pro 64x Nodejs v15.0.0 Npm 7.0.2

I am getting this error when trying to create a new nuxt app

Creating new app

npx create-nuxt-app nuxt_test

create-nuxt-app v3.4.0 Generating Nuxt.js project in nuxt_test ? Project name: nuxt_test ? Programming language: JavaScript ? Package manager: Npm ? UI framework: Vuetify.js ? Nuxt.js modules: Axios, Progressive Web App (PWA) ? Linting tools: ESLint, Prettier ? Testing framework: None ? Rendering mode: Single Page App ? Deployment target: Server (Node.js hosting) ? Development tools: jsconfig.json (Recommended for VS Code if you're not using typescript) ? Continuous integration: None ? Version control system: None

npm WARN ERESOLVE overriding peer dependency npm WARN ERESOLVE overriding peer dependency npm WARN ERESOLVE overriding peer dependency npm WARN Found: [email protected] npm WARN ERESOLVE overriding peer dependency npm WARN Found: [email protected] npm WARN ERESOLVE overriding peer dependency npm WARN Found: [email protected] npm WARN node_modules/eslint npm WARN ERESOLVE overriding peer dependency npm WARN Found: [email protected] npm WARN node_modules/eslint npm WARN ERESOLVE overriding peer dependency npm WARN Found: [email protected] npm WARN node_modules/eslint npm WARN dev eslint@"^7.10.0" from the root project npm WARN npm WARN ERESOLVE overriding peer dependency npm WARN Found: [email protected] npm WARN node_modules/eslint npm WARN dev eslint@"^7.10.0" from the root project npm WARN npm WARN ERESOLVE overriding peer dependency npm WARN Found: [email protected] npm WARN node_modules/eslint npm WARN dev eslint@"^7.10.0" from the root project npm WARN npm WARN Could not resolve dependency: npm WARN ERESOLVE overriding peer dependency npm WARN Found: [email protected] npm WARN node_modules/eslint npm WARN dev eslint@"^7.10.0" from the root project npm WARN npm WARN Could not resolve dependency: npm WARN ERESOLVE overriding peer dependency npm WARN Found: [email protected] npm WARN node_modules/eslint npm WARN dev eslint@"^7.10.0" from the root project npm WARN npm WARN Could not resolve dependency: npm WARN peer eslint@"^5.0.0 || ^6.0.0" from [email protected] npm WARN node_modules/eslint-plugin-vue npm WARN eslint-plugin-vue@"^6.2.2" from @nuxtjs/[email protected] npm WARN node_modules/@nuxtjs/eslint-config npm WARN 1 more (eslint-plugin-nuxt) npm WARN ERESOLVE overriding peer dependency npm WARN Found: [email protected] npm WARN node_modules/webpack

[email protected] lint:js eslint --ext .js,.vue --ignore-path .gitignore . "--fix"

� Successfully created project nuxt_test

To get started:

    cd nuxt_test
    npm run dev

To build & start for production:

    cd nuxt_test
    npm run build
    npm run start

npm run dev

[email protected] dev nuxt

Error

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

• node_modules@nuxt\components\dist\index.js
• node_modules@nuxt\core\dist\core.js
• node_modules@nuxt\cli\dist\cli-index.js
• node_modules@nuxt\cli\dist\cli.js
• node_modules\nuxt\bin\nuxt.js at Object. (node_modules@nuxt\components\dist\index.js:10:31) at Generator.next ()

Webpack 5.1.3 Conflict

I think there is a conflict with webpack 5.1.3

npm list webpack [email protected] D:\proyetos_ypfb\simocs\nuxt_test ├─┬ @nuxtjs/[email protected] │ └─┬ [email protected] │ └─┬ [email protected] │ └─┬ [email protected] │ └── [email protected] deduped ├─┬ @nuxtjs/[email protected] │ ├─┬ [email protected] │ │ └── [email protected] deduped │ └─┬ [email protected] │ ├─┬ [email protected] │ │ └── [email protected] deduped │ └─┬ [email protected] │ └─┬ [email protected] │ └── [email protected] deduped └─┬ [email protected] └─┬ @nuxt/[email protected] ├─┬ @nuxt/[email protected] │ └── [email protected] deduped ├─┬ [email protected] │ └── [email protected] deduped ├─┬ [email protected] │ └── [email protected] deduped ├─┬ [email protected] │ └── [email protected] deduped ├─┬ [email protected] │ ├─┬ [email protected] │ │ └── [email protected] deduped invalid │ └── [email protected] deduped ├─┬ [email protected] │ └── [email protected] deduped ├─┬ [email protected] │ └── [email protected] deduped ├─┬ [email protected] │ └── [email protected] deduped ├─┬ [email protected] │ └── [email protected] deduped ├─┬ [email protected] │ └── [email protected] deduped ├─┬ [email protected] │ └── [email protected] deduped ├─┬ [email protected] │ └── [email protected] deduped ├─┬ [email protected] │ └── [email protected] deduped ├─┬ [email protected] │ └── [email protected] deduped ├─┬ [email protected] │ └── [email protected] deduped ├─┬ [email protected] │ └── [email protected] deduped ├─┬ [email protected] │ └─┬ [email protected] │ └── [email protected] deduped └─┬ [email protected] └── [email protected] deduped

npm ERR! code ELSPROBLEMS npm ERR! invalid: [email protected] D:\projects\nuxt_test\node_modules\webpack

Any suggestion what could be wrong?

[jmiguelzambrana]

I'm using Node JS v14.5.0 in another machine and is working everything fine, so I decided to install the same versión in this machine, and seems to fix the problem.

Any idea why?

[entinio]

I have exactly the same problem on this environment :

Win10 Pro 64x Nodejs v12.13.0 Npm 7.0.3

Might not be an issue about the Nodejs version

[jonaskuske]

Same problem here. 😔 My guess is that it's an issue with npm 7 – or rather some bad dependency / peerDependency declarations, which work in older npm clients but now cause issues in the new npm version.

Edit: Yarn 1.x works for me, and @jmiguelzambrana noticed it works on his machine with Node 14 (which bundles npm 6), but Node 12 with npm 7 is broken too. Has to be the new npm version (and its updated handling of deps and peerDeps).

[clarkdo]

I think @jonaskuske is correct, the error is related to npm 7 breaking change (Automatically installing peer dependencies:) which will choose webpack 5 to be hoisted in root node_module.

@jmiguelzambrana Adding webpack@4 to your dependencies should fix your specific error, I'll also add a quick fix pr

[entinio]

I tried downgrading to 6.14.8 and yes, it removes this problem.

But unfortunately, I actually tried upgrading because I got another problem with npm6 : it has a npm ERR! code EINTEGRITY error when trying to install deepmerge

Looks like I'll need to move to yarn to be able to use nuxt!

[zznull]

This error happens for me as well.

node: v14.15.0 npm: 6.14.8

create-nuxt-app with npm as package manager creates a nuxt app that runs fine at first. But when I install any packages to it, it breaks with an error: Cannot find module 'vue' from '/vagrant'