error occured when do npm install && npm run dev - Vite - Laravel UI React

Question

hello everyone today i had a problem that's when i install laravel ui with react and pass to the step of npm install an error occured so below you will find the error

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\E495\AppData\Local\npm-cache\_logs\2023-01-16T08_08_36_872Z-debug-0.log
PS C:\Users\E495\Desktop\laravel-simple-crud> npm install
npm WARN config global `--global`, `--local` are deprecated. Use `--location=global` instead.
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: undefined@undefined
npm ERR! Found: [email protected]
npm ERR! node_modules/vite
npm ERR!   dev vite@"^4.0.4" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer vite@"^3.0.0" from @vitejs/[email protected]
npm ERR! node_modules/@vitejs/plugin-react
npm ERR!   dev @vitejs/plugin-react@"^2.2.0" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See C:\Users\E495\AppData\Local\npm-cache\eresolve-report.txt for a full report.

so above the error and below you'll find my package.json

{
    "private": true,
    "scripts": {
        "dev": "vite",
        "build": "vite build"
    },
    "devDependencies": {
        "@popperjs/core": "^2.11.6",
        "@tailwindcss/forms": "^0.5.2",
        "@vitejs/plugin-react": "^2.2.0",
        "alpinejs": "^3.4.2",
        "autoprefixer": "^10.4.2",
        "axios": "^1.1.2",
        "bootstrap": "^5.2.3",
        "laravel-vite-plugin": "^0.7.2",
        "lodash": "^4.17.19",
        "postcss": "^8.4.6",
        "react": "^18.2.0",
        "react-dom": "^18.2.0",
        "sass": "^1.56.1",
        "tailwindcss": "^3.1.0",
        "vite": "^4.0.4"
    }
}

i try to read the error and change the vite version to 4.0.4 but without any result

Adam Stevenson · Accepted Answer · 2023-01-19 21:53:42Z

8

You should be able to get by this error with the following command:

npm install --legacy-peer-deps

This previous post goes into detail about what --legacy-peer-deps is doing here.

In short, @vitejs/plugin-react (specifically the version 2.2.0 you have as a dev dependency) has listed an older version of vite (vite@"^3.0.0") as one of its peer dependencies, but it is finding the newer vite@"^4.0.4" installed. For reasons that I can't totally explain (see the linked post or Google if you're curious), NPM is not able to resolve this peer dependency conflict as it usually would for the regular dependencies and dev dependencies that we're more familiar with. --legacy-peer-deps gets around this by bypassing peer dependency auto-installation.

answered Jan 19, 2023 at 21:53

Adam Stevenson

7373 silver badges13 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Adam Stevenson Over a year ago

To assist those Googling with a similar problem—I had this same problem when dealing with a particular version of @sveltejs/vite-plugin-svelte that had a peer dependency issue for vite. The above command also resolve my issue.

Achraf Hebboul Over a year ago

yeah it's work! and also when use npm install --force it will work

Collectives™ on Stack Overflow

error occured when do npm install && npm run dev - Vite - Laravel UI React

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related