jquerynpmjspmtether

JSPM doesn't load dependencies as expected


I've forked the official Bootstrap repository (4.0.0-alpha.6) to implement Gulp rather than Grunt, and to start theming Bootstrap for our own needs.

The project we're developing uses JSPM for its package management. When we try and install our custom Bootstrap project, the dependencies aren't loading correctly.

Running;

jspm install bootstrap=github:TomFoyster/bootstrap@4.0.0-alpha6-ntt-0.0.3

Gives;

Looking up github:TomFoyster/bootstrap
Updating registry cache...
Looking up npm:jquery
ok   Installed npm:jquery@3 (3.1.1)
ok   Installed bootstrap as github:TomFoyster/bootstrap@4.0.0-alpha6-ntt-0.0.3 (4.0.0-alpha6-ntt-0.0.3)
Installed Forks

                           npm:jquery 2.2.4 3.1.1

To inspect individual package constraints, use jspm inspect registry:name.

ok   Install complete.

However, install the official Bootstrap package;

jspm install bootstrap@4.0.0-alpha.6

Gives;

Updating registry cache...
Looking up github:twbs/bootstrap
Looking up npm:jquery
Looking up github:HubSpot/tether
ok   Installed github:HubSpot/tether@^1.1.1 (1.4.0)
ok   Installed bootstrap as github:twbs/bootstrap@4.0.0-alpha.6 (4.0.0-alpha.6)
ok   Install tree has no forks.

ok   Install complete.

You can see the custom repo doesn't install Tether as a dependency, and also installs the jQuery forks - whereas the official package has no forks?

Both of the package.json files in each of the repositories contian the following;

"dependencies": {
    "jquery": ">=1.9.1",
    "tether": "^1.4.0"
},

What have I missed?


Solution

  • When you install a package through jspm it queries the jspm-registry to check if there is a defined alias or override for that package. So doing

    jspm install bootstrap@4.0.0-alpha.6
    

    Will check the registry and find out that there is a custom override defined for bootstrap@4, which reads:

    {
      "main": "dist/js/bootstrap",
      "files": null,
      "ignore": [
        "dist/js/npm"
      ],
      "shim": {
        "dist/js/bootstrap": {
          "deps": [
            "jquery",
            "tether"
          ],
          "exports": "$"
        }
      },
      "dependencies": {
        "jquery": "*",
        "tether": "github:HubSpot/tether@^1.1.1"
      }
    }
    

    And this config overrides whatever is defined in github:twbs/bootstrap.

    Your fork isn't present in the registry, so it installs just what's defined in package.json