Need help updating rollup to fix DOM Clobbering vulnerability :(

[cniccolai]

Select Topic Area

Question

Body

Hi everyone, i'm building my first application ever, but i'm encountering an issue:

When i run npm audit i get some issues shows (see at the bottom). I received a Dependabot alert about it: a DOM Clobbering vulnerability in rollup. The suggested fix is to update to version 3.29.5 or later.

Here is my current setup:

• Current rollup version: 3.29.5 (as seen in package.json)
• Project type: React application using Vite

I've already updated the rollup version in my package.json file to 3.29.5, however, I'm still receiving the alert. . I also tried multiple time nmp audit fix --force but it only creats more issues.

Any help or explaination on how to fix this would be extremely appreciated!

Here is what i get when i run npm audit:

COMMAND: npm audit

npm audit report

rollup <3.29.5
Severity: high
DOM Clobbering Gadget found in rollup bundled scripts that leads to XSS - GHSA-gcx4-mw62-g8wm
fix available via npm audit fix --force
Will install vite-plugin-pwa@0.2.1, which is a breaking change
node_modules/workbox-build/node_modules/rollup
@rollup/plugin-babel <=5.3.1
Depends on vulnerable versions of @rollup/pluginutils
Depends on vulnerable versions of rollup
node_modules/workbox-build/node_modules/@rollup/plugin-babel
workbox-build >=5.0.0-alpha.0
Depends on vulnerable versions of @rollup/plugin-babel
Depends on vulnerable versions of @rollup/plugin-replace
Depends on vulnerable versions of rollup
node_modules/workbox-build
vite-plugin-pwa >=0.3.0
Depends on vulnerable versions of workbox-build
node_modules/vite-plugin-pwa
@rollup/plugin-replace <=4.0.0
Depends on vulnerable versions of @rollup/pluginutils
Depends on vulnerable versions of rollup
node_modules/workbox-build/node_modules/@rollup/plugin-replace
@rollup/pluginutils <=4.1.0
Depends on vulnerable versions of rollup
node_modules/workbox-build/node_modules/@rollup/pluginutils

6 high severity vulnerabilities

To address all issues (including breaking changes), run:
npm audit fix --force

[dagim-demissew]

Add this to your package.json file
"resolutions": {
"rollup": "^3.29.5",
"@rollup/plugin-babel": "^6.0.4",
"@rollup/plugin-node-resolve": "^15.3.0",
"@rollup/plugin-replace": "^6.0.1",
"rollup-plugin-terser": "^7.0.2"
}
and then run npx-force-resolutions
after that run npm install, this should fix the problem.

[cniccolai]

.Hi and thanks so much for your response!

added that to my package.json file but when i try to run npx-force-resolutions on my development evironment (Replit), i got the message Install Replit's Node tools [y/n] ... and then when i run npm install the same issues appear.
On windows powershell, if i try to run it in my app folder, i get this message: npx-force-resolutions : The term 'npx-force-resolutions' is not recognized as the name etc.

What i can do?

[cniccolai]

here ismy package.json file :
{
"name": "react-javascript",
"version": "1.0.0",
"type": "module",
"description": "React TypeScript on Replit, using Vite bundler",
"scripts": {
"dev": "vite",
"build": "vite build",
"preview": "vite preview"
},
"keywords": [],
"author": "",
"license": "ISC",
"devDependencies": {
"@types/react": "^18.2.37",
"@types/react-dom": "^18.2.15",
"@vitejs/plugin-react": "^4.2.0",
"autoprefixer": "^10.4.20",
"postcss": "^8.4.47",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"rollup": "^3.29.5",
"tailwindcss": "^3.4.12",
"typescript": "^5.2.2",
"vite": "^5.0.0"
},
"dependencies": {
"@emailjs/browser": "^4.4.1",
"@huggingface/inference": "^2.8.0",
"@reduxjs/toolkit": "^2.2.7",
"framer-motion": "^11.5.4",
"fuse.js": "^7.0.0",
"lottie-react": "^2.4.0",
"react-confetti": "^6.1.0",
"react-icons": "^5.3.0",
"react-lazy-load-image-component": "^1.6.2",
"react-organizational-chart": "^2.2.1",
"react-redux": "^9.1.2",
"react-router-dom": "^6.26.2",
"react-swipeable": "^7.0.1",
"react-vertical-timeline-component": "^3.6.0",
"recharts": "^2.12.7",
"redux": "^5.0.1",
"vite-plugin-pwa": "^0.20.5",
"workbox-window": "^7.1.0"
}
}

[dagim-demissew]

You can try responding with y when it asks, and then proceed with npm install again. also npx-force-resolutions doesn't exist directly. What you probably need is just npx npm-force-resolutions.

[MasterInQuestion]

    If dropping alike libraries is not applicable for your use case:
    Alike problems afraid could never be thoroughly annihilated...

    The essential cause is developers leveraged their handling to some external libraries:
    Blind trusting and assume things shall work; while they didn't.