I want to make react portfolio from freecodecamp. after all packages installed then change App.css to App.scss and then write some code, then show error like this:
"./src/App.scss (./node_modules/css-loader??ref--6-oneOf-5-1!./node_modules/postcss-loader/src??postcss!./node_modules/sass-loader/lib/loader.js??ref--6-oneOf-5-3!./src/App.scss)
To import Sass files, you first need to install node-sass.
Run `npm install node-sass` or `yarn add node-sass` inside your workspace.
Require stack:
- C:\Tarikul\Projects\portfolio\node_modules\sass-loader\lib\loader.js
- C:\Tarikul\Projects\portfolio\node_modules\loader-runner\lib\loadLoader.js
- C:\Tarikul\Projects\portfolio\node_modules\loader-runner\lib\LoaderRunner.js
- C:\Tarikul\Projects\portfolio\node_modules\webpack\lib\NormalModule.js
- C:\Tarikul\Projects\portfolio\node_modules\webpack\lib\NormalModuleFactory.js
- C:\Tarikul\Projects\portfolio\node_modules\webpack\lib\Compiler.js
- C:\Tarikul\Projects\portfolio\node_modules\webpack\lib\webpack.js
- C:\Tarikul\Projects\portfolio\node_modules\react-scripts\scripts\start.js"
Then install "npm install node-sass":
Then show another error like this: "Error: Node Sass version 8.0.0 is incompatible with ^4.0.0."
I try to "npm install node-sass#4.0.0"
and also try: "npm install node-sass#8.0.0"
but problem is not fixed
Add this to your package.json:
"overrides": {
"node-sass": "^8.0.0",
}
If you are using Node.js 18.x, you need node-sass#8.0.0. Older packages will probably have an older dependency. You can force the dependency, don't worry about compatibility, node-sass is deprecated and hasn't changed in years - except to support newer Node.js versions.
I am getting 6 vulnerabilities after running npm audit report:
I tried a solution and overridden the vulnerable versions of a particular package with their latest versions in package.json file like this:
"overrides": {
"nth-check": "2.1.1",
"#svgr/webpack": "6.5.1",
"#svgr/plugin-svgo": "6.5.1",
"svgo": "3.0.1",
"css-select": "5.1.0"
}
Then I updated the npm packages with npm update. But it did not change the result.
Tried another solution by making a resolution object in package.json and specified specific versions of a particular package, and ran it using npx i npm-force-resolutions but it gives this error:
npm ERR! could not determine executable to run.
But I am still unable to fix the npm vulnerabilities. Please help!
You should delete both node_modules and package-lock.json before launching npm install again; this will require more time to install all dependencies, but this will override all the version that are currently installed (it will bring also minor updates in dependencies).
Also, for this vulnerability, you only need to override nth-check. You can see the changes by executing npm list nth-check with and without the override (remember to delete both node_modules and package-lock.json).
I am trying to npm install vue-mapbox mapbox-gl, and I'm getting a dependency tree error.
I'm running Nuxt.js SSR with Vuetify and haven't installed anything related to Mapbox prior to running this install and am getting this error.
38 error code ERESOLVE
39 error ERESOLVE unable to resolve dependency tree
40 error
41 error While resolving: [1mexample[22m#[1m1.0.0[22m
41 error Found: [1mmapbox-gl[22m#[1m1.13.0[22m[2m[22m
41 error [2mnode_modules/mapbox-gl[22m
41 error [1mmapbox-gl[22m#"[1m^1.13.0[22m" from the root project
41 error
41 error Could not resolve dependency:
41 error [35mpeer[39m [1mmapbox-gl[22m#"[1m^0.53.0[22m" from [1mvue-mapbox[22m#[1m0.4.1[22m[2m[22m
41 error [2mnode_modules/vue-mapbox[22m
41 error [1mvue-mapbox[22m#"[1m*[22m" from the root project
41 error
41 error Fix the upstream dependency conflict, or retry
41 error this command with --force, or --legacy-peer-deps
41 error to accept an incorrect (and potentially broken) dependency resolution.
41 error
41 error See /Users/user/.npm/eresolve-report.txt for a full report.
42 verbose exit 1
What's the right way to go about fixing this upstream dependency conflict?
It looks like it's a problem with peer dependencies in the latest version of npm (v7) which is still a beta version.
Try with npm install --legacy-peer-deps. For detailed information check the blog post npm v7 Series - Beta Release! And: SemVer-Major Changes in npm v7.
Use --legacy-peer-deps after npm install. For example, if you want to install Radium, use:
npm install --legacy-peer-deps --save radium
There are two ways:
use npm install --legacy-peer-deps to install, and if this doesn't work use
the force method. Add --force next to npm install: npm install --force
You can follow these commands
First type:
npm config set legacy-peer-deps true
Then type:
npx create-react-app my-app
Your dependency mexample requires mmapbox-gl v1.13.0 and mvue-mapbox requires mmapbox-gl v0.53.0.
NPM doesn't know which version to install, so it gives a warning. You can bypass the errors using -- force or --legacy-peer-deps, but you are ignoring an error, and making unexpected results.
Production Options:
Probably one of your packages is outdated. Upgrading packages and fixing upgrade errors might fix the dependency conflict.
Overriding a dependency manually to avoid the warning and error. You are setting the version to a specific one that you know that works. Usually the newer version.
Example solution with override. Your package.json file will look like this:
{
"name": "my-app",
"version": "0.1.0",
"private": true,
"dependencies": {
"mexample": "^1.2.0",
"vue-mapbox": "*"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"overrides": {
"mmapbox-gl": "1.13.0"
}
}
The last option is bypassing using either:
--legacy-peer-deps completely ignores all peerDependencies using the newest version without pinning on file package-lock.json
--force forces the use of the newest, pinning all the versions on package-lock.json
Extra: You shouldn't use "*" as a version, because it might update major and break dependencies.
Until npm version 7.19.1, it still had the same issue. After upgrading to version 7.20.3, use command npm install -g npm#latest and npm audit fix. All packages will be fixed without error.
I tried multiple ways, but nothing was working for me. At last I tried this and it worked:
npm config set legacy-peer-deps true
Run this in the project folder and then try to install any package. It might work for you as well.
To solve it, fix the upstream dependency conflict installing NPM packages error
Method 1. Just use --legacy-peer-deps after npm install.
For example, if you want to install Axios, use
npm install --legacy-peer-deps --save axios.
Method 2. Updating npm and 'audit fix'
npm I -g npm#latest
npm audit fix --force
Method 3. Using --force to install packages
npm install axios --force
I was stuck on this issue for long which also makes error from other commands which calls for some install commands that was breaking.
The only solution that works (maybe suppresses the error) is
npm config set legacy-peer-deps true
This will set the configuration of legacy-peer-deps to true
To resolve npm dependencies and conflicts with npm packages, use npm-check-updates.
Almost all answers here suggest using force or legacy-peer-deps. Though this will technically work, please note that this is not recommended by NPM if you can avoid it anymore (source). Some folks may not have a choice, but I was able to resolve my dependency conflicts by deleting node-modules and package-lock.json then manually updating packages to their latest version one at a time until it stopped complaining (packages mentioned in the error messages after running npm i. Not a great or clean solution, but at least my packages are up-to-date and I'm not ignoring errors or using legacy solutions.
A lot of upvotes for using --legacy-peer-deps, but if --force works, I would recommend using that since it still pins many dependency versions while --legacy-peer-deps ignores peer dependencies entirely. See the example below:
npm: When to use --force and --legacy-peer-deps
I started getting this error on Azure DevOps a few days ago. I initially thought it was a glitch on the Azure side, but since it continued, we started looking into it a bit more.
It turns out the agent we are using, windows-2022, was updated a few days ago:
Updating readme file for win22 version 20220607.3 (#5713)
Node and NPM now match the latest Node.js LTS version: 16.15.1 (includes npm 8.11.0)
Downloads
You can view all agents-included software on Microsoft-hosted agents, Software.
After reading on Microsoft Visual Studio Developer Community, they recommend downgrading Node.js using Node.js Tool Installer task like this:
- task: NodeTool#0
inputs:
versionSpec: '16.14.2'
Node.js Tool Installer task
npm install fails in Azure DevOps Hosted Agent
However, we decided that we do not want to downgrade Node.js, so the first step was matching Node.js locally with LTS version 16.15.1 and npm 8.11.0.
When running npm ci, we then got the same error locally.
We tried npm ci --force and we then got this error:
npm ci can only install packages when your package.json and
package-lock.json or npm-shrinkwrap.json are in sync. Please update
your lock file with npm install before continuing.
npm install gave the same error even after node_modules was manually removed, but npm install --force worked, and it generated a new package-lock.json file.
npm ci still failed with the same error, but running npm ci --force worked. We decided to update Azure DevOps .yml to include --force and checked in the new package-lock.json file. After doing this, everything worked like before and we could now update our packages one by one.
delete the package-lock.json file
modify the package.json file, updating the version as indicated by the peer dependency
Add a tilde or caret for allowing install latest version and resolving dependency issues, for example :
~1.0.2 means to install version 1.0.2 or the latest patch version such as 1.0.4.
^1.0.2 means to install version 1.0.2 or the latest minor or patch version such as 1.1.0.
run npm install or npm udpate
I resolved this by adding
steps:
- task: NodeTool#0
inputs:
versionSpec: '12.x'
Nothing here worked for me.
After struggling with this issue for so long, I found a solution that worked.
Apparently I had some packages installed globally.
Listed them with:
npm list -g --depth=0
Then removed the unwanted packages with:
npm uninstall -g <package-name>
Finally I got the problem fixed
Have anyone been in this situation before ?
I run my code with CI/CD
after nest build, it gives me error :
node_modules/#types/superagent/index.d.ts:23:10 - error TS2305: Module '"buffer"' has no exported member 'Blob'. 23 import { Blob } from "buffer";
I don't know why? Please share if you got a solution for this one.
We had the same problem after upgrading nest 7.5.x to 8.0.0. The dependency "supertest" for "nestjs/testing" has a dependency on "#types/supertest" which wildcards "#types/superagent": "*", and that dependency has another wildcard dependency "#types/node": "*", but the types within #types/supertest actually require #types/node >=16.X.X.
So nestjs/testing -> supertest -> #types/supertest -> #types/superagent -> #types/node >= 16.X.X is your problem and error.
The comments mentioned are accurate because these package managers wildcard their dependencies to get the latest version of dependencies. They should but do not add peerDependencies with dependencies requirements such as "#types/node": "">=12.0.0 <16.0.0". Instead they say anything, "#types/node": "*" so the error is post package install, no npm warnings/errors. "It worked yesterday but not today" is your big red flag because when you ran npm install, with these wildcard dependencies even though you did not know it installed the latest version. Since it installed everything wildcard today, but not yesterday, it worked yesterday.
In addition, but also important is that you are have pinned #types/node <16.0.0 thus your error in combination with the other package changes.
One option: revert your package-lock.json changes and run npm ci
Another option: set your package.json dependency for #types/node to -> "#types/node": "^16.0.0",.
Another option: accept that wildcards are wrong and you don't trust what is going on there so pin the #types/superagent dependency to the one prior.
As for me and my family, we use nestjs with AWS lambda which runtime does not include nodejs 16, and not everyone on my team runs npm ci we more typically run npm install so the solution was
package.json
...
"devDependencies": {
...
"#types/node": "14.18.2",
"#types/superagent": "4.1.10",
"#types/supertest": "^2.0.11",
...
Upgrading #types/node to ^14.18.10 and typescript to ^3.9.10 worked for me.
"devDependencies": {
"#types/node": "^14.18.10",
"typescript": "^3.9.10"
},
Found on this discussion from Github
downgrading #types/superagent from v15.x.x to 14.1.14 solved the issue for me. v15 had some performance issues at the typing of this message
"npm i --save #types/superagent#4.1.14" did the trick
One tip is use npm view to get some info.
If you type
npm view #types/node
That shows the ts version compatibility. In my case, Is had to upgrade #types/node to 14.14.31, because I'm using ts 3.4.2.
if you have installed the npm, then delete the node_module file and use yarn install to add the new node_module and vice versa.
We want to use AsyncAPI to document our RabbitMQ messaging. Therefore, we installed asyncapi/generator as a npm dependency.
If you have a look at the package.json you can see that it references npmi as a dependency which in turn is referencing to global-npm. If we want to run it, a globally installed node and npm is necessary.
Now if we run the generator ($ ag ./docs/asyncapi.yaml #asyncapi/html-template --output ./docs/asyncapi/ --force-write) on a machine which has no globally installed npm following error message appears:
/path/to/project/node_modules/global-npm/index.js:13
throw err
^
Error: Cannot find module 'npm'
at throwNotFoundError (/path/to/project/node_modules/global-npm/index.js:11:13)
at /path/to/project/node_modules/global-npm/index.js:39:5
...
As a workaround we declared npm itself as a dependency:
"dependencies": {
"#asyncapi/generator": "^1.1.4",
"#asyncapi/html-template": "^0.15.4",
"#asyncapi/markdown-template": "^0.11.1",
"npm": "^6.14.9",
...
I've never seen such a thing. Is this acceptable or do we need to install our npm on our machines separatly?
if you run ag you must have installed it with npm initially right? so npm is most probably on this machine already.
The error you have, I saw it on windows only, when you have the generator as dependency, and most likely you use nvm.
Solution was this, so manual bump of global-npm to have this fixed in npmi. This is a workaround,long term I think we need to get rid of npmi dependency from the generator I think
We only had this issue in our CI/CD pipeline working with maven-frontend-plugin which is installing node/npm. npm is located in node/node_modules. This is no location where AsyncAPI looks for npm. In order to fix this issue we link the npm-cli.js (which is npm) from
the maven-frontend-plugin to a well known place where AsyncApi looks up for npm node_modules/.bin.
- ln -sf "$(pwd)/node/node_modules/npm/bin/npm-cli.js" "$(pwd)/node_modules/.bin/npm"