Cordova Error: Failed to fetch plugin npm not being able to find a package.json in a package you are trying to install

In the last days, a lot of Cordova developers that updated the Cordova platform in Node.js to the version 7.0.1, are facing a curious exception when installing plugins that are not so recent and haven't been update for a couple of months:

Error: Failed to fetch plugin https://url-of-plugin-repository.git via registry.
Probably this is either a connection problem, or plugin spec is incorrect.
Check your connection and plugin name/version/URL.
Error: cmd: Command failed with exit code 4294963228 Error output:
npm ERR! addLocal Could not install C:\Users\username\AppData\Local\Temp\npm-9904-d274866c\git-cache-756b062e\1e132d0a7a8dfd323b59c6b6edf6c4e142d3ee98
npm ERR! Windows_NT 10.0.14393
npm ERR! argv "C:\\Program Files\\nodejs\\node.exe" "C:\\Program Files\\nodejs\\node_modules\\npm\\bin\\npm-cli.js" "install" "https://url-of-plugin-repository.git" "--save"
npm ERR! node v7.7.1
npm ERR! npm  v4.1.2
npm ERR! code EISDIR
npm ERR! errno -4068
npm ERR! syscall read

npm ERR! eisdir EISDIR: illegal operation on a directory, read
npm ERR! eisdir This is most likely not a problem with npm itself
npm ERR! eisdir and is related to npm not being able to find a package.json in
npm ERR! eisdir a package you are trying to install.

npm ERR! Please include the following file with any support request:
npm ERR!     c:\xampp\htdocs\cordova\hello\node_modules\npm-debug.log

As the problem indicates, clearly, the issue is related to the package.json file, that has never existed in old plugins and therefore is causing this problem now. Besides this problem happens often with plugins that are installed via its git repository URL e.g https://github.com/ourcodeworld/cordova-ourcodeworld-filebrowser.git. This is achieved through cordova-fetch, module used for fetching modules from npm and gitURLs. It fetches the modules via npm install. It can also npm uninstall modules from a project.

Solution

With this error, you can find yourself in 2 different points of view:

  • You're the owner of the plugin.
  • You're trying to install a third party plugin.

A. You are the owner of the plugin

If you're the owner of the plugin and someone is reporting that he ain't able to install your plugin using the cordova add plugin URL command, you will need to create a new package.json file in the root folder of your plugin. If you're not familiar with NPM, you should read more about the package file in the official documentation here.

To create a new package file for your plugin, you will obviously use Node.js in the command line and execute the following command (once located with the terminal in the folder of your plugin):

npm init

This command will start an interactive prompt (that you can simply skip by pressing Enter on every question) that will allow you to create your package.json file. Obviously, although isn't necessary, you should provide correctly all the information. The package.json file located in the root folder of the plugin will look as follows: 

{
    "name": "cordova-ourcodeworld-filebrowser",
    "version": "1.0.0",
    "description": "Some description of what your plugin does",
    "main": "index.js",
    "scripts": {
        "test": "echo \"Error: no test specified\" && exit 1"
    },
    "repository": {
        "type": "git",
        "url": "git+https://github.com/username/plugin-repository.git"
    },
    "keywords": [],
    "author": "Author Name",
    "license": "MIT",
    "bugs": {
        "url": "https://github.com/username/plugin-repository/issues"
    },
    "homepage": "https://github.com/username/plugin-repository#readme"
}

The information should obviously be changed according to the correct info of your/the plugin.

B. If it's a third party plugin

If you're not the owner of the plugin and you're only trying to install an awesome plugin that you did just find on Github, then you need to encourage that the owner of the plugin creates this file as soon as possible to prevent this error from appearing on future installations. If the plugin seems to be not maintained anymore, then you can download the plugin with git, create this file by yourself and finally install the plugin from the local source.

1. Download repository source code

If the plugin is hosted on Github, you can clone it into a local folder on your computer using git e.g (in this example will be cloned into C:/Users/Me/Desktop):

git clone https://github.com/ourcodeworld/cordova-ourcodeworld-filebrowser.git

In the clone directory it should be now (once finished) a new folder with the name of the clone repository.

2. Create the package.json file

Follow the steps of the option A (you're the owner of the plugin) to create the package.json file.

3. Install it from the local source

As final step, you can install the plugin from the cloned repository but instead of providing the git URL, provide the local path to the plugin:

REM Navigate to the folder of your cordova project with the terminal
cd FolderOfYourCordovaProject
REM install the plugin from the local source
cordova plugin add C:/Users/Me/Desktop/cordova-ourcodeworld-filebrowser

Happy coding !

Become a more social person