How to require a JS library in a composer.json file

Question

I'm trying to require a 3rd-party JS library in my module. Unfortunately, the library is not available as a composer package.

I tried to define the library in my module's composer.json file like the following:

{
  ...
  "require": {
    "VENDORNAME/PACKAGENAME": "1.2.3"
  },
  "repositories": [
    {
      "type": "composer",
      "url": "https://packages.drupal.org/8"
    },
    {
      "type": "package",
      "package": {
        "name": "VENDORNAME/PACKAGENAME",
        "version": "1.2.3",
        "type": "drupal-library",
        "dist": {
          "url": "https://github.com/VENDORNAME/PACKAGENAME/archive/1.2.3.zip",
          "type": "zip"
        }
      }
    }
  ]
}

But, composer did a bit of complaining about that, and didn't even install the module:

Your requirements could not be resolved to an installable set of packages.

  Problem 1
    - Installation request for drupal/MYMODULE 1.x-dev -> satisfiable by drupal/MYMODULE[1.x-dev].
    - drupal/MYMODULE 1.x-dev requires VENDORNAME/PACKAGENAME 1.2.3 -> no matching package found.

Potential causes:
 - A typo in the package name
 - The package is not available in a stable-enough version according to your minimum-stability setting
   see <https://getcomposer.org/doc/04-schema.md#minimum-stability> for more details.
 - It's a private package and you forgot to add a custom repository to find it

Read <https://getcomposer.org/doc/articles/troubleshooting.md> for further common problems.

Installation failed, reverting ./composer.json to its original content.

I should mention that I base this on Webprofiler module (Devel's sub-module). Though, in its README, it instructs defining those packages in the main composer.json file.

I want to define the JS library as a module requirement in module's composer.json file.

How can I require a code from a Git repository as if it is a composer package, and use it in my module's composer.json file?

Answer 1

The instruction in Webprofiler completely right and it's referral to composer.json in the root directory, here another example to add react to Drupal:

    {
        "type": "package",
        "package": {
            "name": "facebook/react",
            "version": "v16.3.2",
            "type": "drupal-library",
            "dist": {
                "url": "https://github.com/facebook/react/archive/v16.3.2.zip",
                "type": "zip"
            }
        }
    }

After that, I run:

composer require --prefer-dist facebook/react:16.3.*

Completely works fine and the package was download to libraries folder.

From what you posted I can see that you did not add the package information.

This need to be changed VENDORNAME/PACKAGENAME so in the above example:

VENDORNAME is facebook

PACKAGENAME is react

here is how you get this information, the attached image from React Github repository

also, you can find that information in the repository URL.

here is the full repositories part I have it in one of the projects I'm working on:

 "repositories": [
        {
            "type": "composer",
            "url": "https://packages.drupal.org/8"
        },
        {
            "type": "package",
            "package": {
                "name": "d3/d3",
                "version": "v3.5.17",
                "type": "drupal-library",
                "dist": {
                    "url": "https://github.com/d3/d3/archive/v3.5.17.zip",
                    "type": "zip"
                }
            }
        },
        {
            "type": "package",
            "package": {
                "name": "facebook/react",
                "version": "v16.3.2",
                "type": "drupal-library",
                "dist": {
                    "url": "https://github.com/facebook/react/archive/v16.3.2.zip",
                    "type": "zip"
                }
            }
        },
        {
            "type": "package",
            "package": {
                "name": "components/highlightjs",
                "version": "9.7.0",
                "type": "drupal-library",
                "dist": {
                    "url": "https://github.com/components/highlightjs/archive/9.7.0.zip",
                    "type": "zip"
                }
            }
        }


    ]

If your module defines external dependencies which not hosted on Packagist or Drupal.org then Drupal core will not automatically discover or manage these dependencies.

You must use the wikimedia/composer-merge-plugin package to accomplish this. This plugin is installed with Drupal core.

Thats why in Webprofiler module they add the instruction to readme not to the composer.json in Webprofiler directory.