移除Cordova插件后仍加载异常，如何重建package.json？

Hey there, let's work through this issue step by step—unfortunately, Cordova can leave behind cached plugin references even after you run the uninstall command, and mixing up package.json locations doesn't help. Here's how to fix both problems:

First: Eliminate Residual Plugin Loading #

The net::ERR_ABORTED error means your app's built assets still reference the uninstalled cordova-plugin-media-capture. Let's wipe out those cached references:

• Clean the Cordova build cache: Run this command first to clear temporary build files:

  cordova clean
  

• Remove and re-add your target platform: Platform-specific files (like in platforms/android or platforms/ios) often retain old plugin code. Refresh them with:

  # Replace "android" with your platform (ios, etc.)
  cordova platform remove android && cordova platform add android
  

• Verify cordova.js is regenerated: The cordova.js file in your www folder should be updated after running cordova prepare. If it's still referencing old plugins, delete it manually and run cordova prepare again—Cordova will regenerate a fresh version.

Second: Reconstruct package.json & Understand File Locations #

Let's clarify where these files belong and how to rebuild them:

Where should package.json and package-lock.json live? #

• Root directory of your project: This is where Cordova stores its plugin and platform dependencies. The www/package.json you mentioned is for front-end assets (like if you're using a framework like Vue or React) and has nothing to do with Cordova's plugin management.
• package-lock.json also belongs in the root—it's npm's way of locking dependency versions, including Cordova plugins installed via npm.

How to rebuild the root package.json: #

1. Backup and remove existing files: If your root package.json is corrupted, rename it to package.json.bak and delete package-lock.json to start fresh.
2. Generate a base package.json: Run this to create a basic npm package file (you can accept defaults or customize):

   npm init -y
   

3. Re-add your plugins with --save: For every plugin you want to keep, run the add command with the --save flag—this will automatically populate the cordova.plugins section in your root package.json:

   # Example: Add the whitelist plugin (required for Cordova)
   cordova plugin add cordova-plugin-whitelist --save
   # Repeat for all your necessary plugins
   

4. Sync with Cordova: Run cordova prepare to ensure the new package.json config is applied to your project.

Alternative: Manual package.json setup #

If you prefer, you can manually create a root package.json with the Cordova structure. Here's a template:

{
  "name": "your-app-name",
  "version": "1.0.0",
  "description": "Your app description",
  "cordova": {
    "platforms": [
      "android" // Add your target platforms here
    ],
    "plugins": {
      "cordova-plugin-whitelist": {} // Add your plugins here
    }
  },
  "dependencies": {}
}

After saving this, run cordova prepare to sync everything up.

Once you've completed these steps, your app should stop trying to load the uninstalled plugins, and your root package.json will properly track your Cordova dependencies.

内容的提问来源于stack exchange，提问作者Maenny