React JS项目漏洞修复方案求助：新手遭遇漏洞反复且常规修复命令无效问题

Hey there! I totally get how frustrating this can be when you're just starting out with React—let's break this down into simple, actionable steps that don't require fancy tech jargon.

First, let's clear up one thing: reinstalling VS Code didn't cause these vulnerabilities. They come from outdated dependency packages in your project, not your editor. Let's fix this:

1. Use the Latest Version of Create-React-App to Generate a New Project #

The most common reason for this many vulnerabilities is using an old version of create-react-app that generates projects with outdated dependencies. Here's how to fix that:

• First, uninstall the old global version (if you have it):

  npm uninstall -g create-react-app
  

• Then, create your app using the latest version directly with npx (this ensures you're always using the newest template):

  npx create-react-app@latest your-app-name
  

This new project will have updated dependencies, which should eliminate most (if not all) of the vulnerabilities you saw.

2. Fix Vulnerabilities in an Existing Project (If You Don't Want to Start Over) #

If you want to save your current work instead of creating a new app, follow these steps:

• Delete the node_modules folder and package-lock.json file from your project directory (don't worry—we'll reinstall everything).
• Open your package.json file, and update these core dependencies to their latest stable versions:
  • Update react and react-dom to at least ^18.2.0
  • Update react-scripts to ^5.0.1
• Run this command to reinstall dependencies with the updated versions:

  npm install
  

• Now run npm audit again to check if the vulnerabilities are gone.

3. Fix Stubborn Indirect Dependency Vulnerabilities #

Sometimes vulnerabilities come from "indirect" dependencies (packages that your direct dependencies use, not ones you listed in package.json). If npm audit fix doesn't work for these, you can force an update using npm's override feature (works for npm 8.3+):

• Run npm audit to see exactly which package has the vulnerability (look for lines like "Moderate severity vulnerability found in lodash").
• Add an overrides section to your package.json file to force that package to a safe version. For example, if the issue is with lodash, your package.json would look like this:

  {
    "name": "your-app",
    "version": "0.1.0",
    "overrides": {
      "lodash": "^4.17.21"
    },
    // rest of your package.json content...
  }
  

• Run npm install again, and the vulnerable package will be updated to the safe version you specified.

Quick Tip for Beginners #

Avoid using npm audit fix --force unless you're sure what you're doing—it can break your project by updating packages that aren't compatible with each other. Always try the steps above first!

内容的提问来源于stack exchange，提问作者Faisal S. Abd.