jspm / jspm-cli

ES Module Package Manager
https://jspm.org
Apache License 2.0
3.77k stars 273 forks source link

`jspm install obs-websocket-js` creates invalid link #2581

Open arthurka-o opened 2 weeks ago

arthurka-o commented 2 weeks ago

Hi. When running jspm install obs-websocket-js it creates this import map:

{
  "env": [
    "browser",
    "development",
    "module"
  ],
  "imports": {
    "obs-websocket-js": "https://ga.jspm.io/npm:obs-websocket-js@5.0.6/dist/json.js"
  },
  "scopes": {
    "https://ga.jspm.io/": {
      "crypto": "https://ga.jspm.io/npm:@jspm/core@2.0.1/nodelibs/browser/crypto.js",
      "crypto-js/": "https://ga.jspm.io/npm:crypto-js@4.2.0/",
      "debug": "https://ga.jspm.io/npm:debug@4.3.7/src/browser.js",
      "eventemitter3": "https://ga.jspm.io/npm:eventemitter3@5.0.1/index.mjs",
      "isomorphic-ws": "https://ga.jspm.io/npm:isomorphic-ws@5.0.0/browser.js",
      "ms": "https://ga.jspm.io/npm:ms@2.1.3/index.js",
      "process": "https://ga.jspm.io/npm:@jspm/core@2.0.1/nodelibs/browser/process.js"
    }
  }
}

I don't have a lot of experience with JS ecosystem, but I believe this line is incorrect

"crypto-js/": "https://ga.jspm.io/npm:crypto-js@4.2.0/"

The name includes / at the end, and the link leads to 404. Using --provider unpkg generated link at least leads to somewhere

https://unpkg.com/crypto-js@4.2.0/

Not sure where it goes wrong. Initially I was trying to pin obs-websocket-js lib in my Rails app. Apologizing if I missed something obvious.

guybedford commented 2 weeks ago

What environment are you running this that you are getting a 404? In the browser it works correctly, see eg https://jspm.org/sandbox#H4sIAAAAAAAAA4WUUXPTMAzH3/cpRHgBrombjcGuS3sdxxiMdRtkvbHHxNEab7EdbHchcHx3HKfpLb2tPLQ+W9LP/8iSoheZpKYuEXLDi8lO1C2YZJMdgIijSYDmidJoxt7S3PoHnjMYZgqczIVbs4i0+3WISDiOvQeGVSmV8YBKYVBYRMUyk48zfGAUfbcZABPMsKTwNU0KHIf2goi0CqJUZrWjvvB9uwCcxpczOEGBKjFSwRfe8GGWlM56nDED8+9nI/s9ptQjQhada3CnSx4wSV7Od8/zm5MP9x9nQ1XHv0/jeZjXxwc/QxZeXsXq4upg/+Is+3z+VdxU4dXlt1k1O0p/fKrieH5kb/H9RhBEmipWGmiyN/aY08GT0mXnjxOzOtTeaHVgj2Sq/QpTLek9Gv+usXlrqclaoyj5aNN1uh8Mg3ckY9qQOy2FdfYc9u+gvU5TWWLvtifIj8zWgaq6NHKLiGmzIVQqnO4GYTAkQmZYsFSTVMlKoyItohEz2ORa0WQLe+00fRvsWvRjQIbpcrEl1tlt3F7wnmhFOzUbMvDB1hxyZgyqvS20np/Lc0iYyPBXwPtApiWXqswZ9attb9fzc8DhMxL5NgzXLut7KzH9yFJJinpb+P8fb8Xw7ZotqWGPqsrW1U733/wi0hZ8U9+rhoTjGGY2sECIc8Y1tAUPtg00lLKob1lR6FXDdP2S6FpQsG82fvY1tM8d1dcNdRoGYZM/V/gbtkYtUCW1lootmBh7iZCi5nKpvcmm4l7DthTXrdDpfmPFgW27667rTjXcKsmfaNvDlglACFwrZtB+NBPQUu20y+xERYUDsDPKQhPQWCZ2DiHYnCBUzOT20LNp8CAxRrF0aW1SgMmxo7R6A3eNnZ9aFhgUcvGqr/D1Ye9xItKOTDtB3Sj/B71Ig5viBQAA.

The trailing slash in the import map is used to map entire paths, which JSPM does when it knows all mappings under that path are identity mappings, so it can remove the redundancy automatically.

arthurka-o commented 1 week ago

My environment is a fresh Rails 8.0.0.beta1 app where I tried to pin obs-websocket-js with importmaps-rails

❯ ./bin/importmap pin obs-websocket-js
Pinning "obs-websocket-js" to vendor/javascript/obs-websocket-js.js via download from https://ga.jspm.io/npm:obs-websocket-js@5.0.6/dist/json.js
Pinning "crypto" to vendor/javascript/crypto.js via download from https://ga.jspm.io/npm:@jspm/core@2.1.0/nodelibs/browser/crypto.js
Pinning "crypto-js/" to vendor/javascript/crypto-js/.js via download from https://ga.jspm.io/npm:crypto-js@4.2.0/
/home/arthur/.rvm/gems/ruby-3.3.4/gems/importmap-rails-2.0.2/lib/importmap/packager.rb:84:in `handle_failure_response': Unexpected response code (404) (Importmap::Packager::HTTPError)
        from /home/arthur/.rvm/gems/ruby-3.3.4/gems/importmap-rails-2.0.2/lib/importmap/packager.rb:122:in `download_package_file'
        from /home/arthur/.rvm/gems/ruby-3.3.4/gems/importmap-rails-2.0.2/lib/importmap/packager.rb:57:in `download'
        from /home/arthur/.rvm/gems/ruby-3.3.4/gems/importmap-rails-2.0.2/lib/importmap/commands.rb:19:in `block in pin'
        from /home/arthur/.rvm/gems/ruby-3.3.4/gems/importmap-rails-2.0.2/lib/importmap/commands.rb:17:in `each'
        from /home/arthur/.rvm/gems/ruby-3.3.4/gems/importmap-rails-2.0.2/lib/importmap/commands.rb:17:in `pin'
        from /home/arthur/.rvm/gems/ruby-3.3.4/gems/thor-1.3.2/lib/thor/command.rb:28:in `run'
        from /home/arthur/.rvm/gems/ruby-3.3.4/gems/thor-1.3.2/lib/thor/invocation.rb:127:in `invoke_command'
        from /home/arthur/.rvm/gems/ruby-3.3.4/gems/thor-1.3.2/lib/thor.rb:538:in `dispatch'
        from /home/arthur/.rvm/gems/ruby-3.3.4/gems/thor-1.3.2/lib/thor/base.rb:584:in `start'
        from /home/arthur/.rvm/gems/ruby-3.3.4/gems/importmap-rails-2.0.2/lib/importmap/commands.rb:141:in `<main>'
        from /home/arthur/.rvm/rubies/ruby-3.3.4/lib/ruby/3.3.0/bundled_gems.rb:74:in `require'
        from /home/arthur/.rvm/rubies/ruby-3.3.4/lib/ruby/3.3.0/bundled_gems.rb:74:in `block (2 levels) in replace_require'
        from /home/arthur/.rvm/gems/ruby-3.3.4/gems/bootsnap-1.18.4/lib/bootsnap/load_path_cache/core_ext/kernel_require.rb:30:in `require'
        from /home/arthur/.rvm/gems/ruby-3.3.4/gems/zeitwerk-2.6.18/lib/zeitwerk/kernel.rb:34:in `require'
        from ./bin/importmap:4:in `<main>'

And then I tried to open https://ga.jspm.io/npm:crypto-js@4.2.0/ in a browser and it returns 404. That's why I assumed that this error is on jspm side. Especially when I run jspm install obs-websocket-js in a different directory to get the same 404 link. But now seeing that it works in a browser sandbox makes me confused. Maybe it is indeed problem with importmaps-rails

guybedford commented 1 week ago

There are a few issues like this in this repo, which are examples that work correctly on generator.jspm.io, eg here is this one:

https://jspm.org/sandbox#H4sIAAAAAAAAA4WUUXPTMAzH3/cpRHgBrombjcGuS3sdxxiMdRtkvbHHxNEab7EdbHchcHx3HKfpLb2tPLQ+W9LP/8iSoheZpKYuEXLDi8lO1C2YZJMdgIijSYDmidJoxt7S3PoHnjMYZgqczIVbs4i0+3WISDiOvQeGVSmV8YBKYVBYRMUyk48zfGAUfbcZABPMsKTwNU0KHIf2goi0CqJUZrWjvvB9uwCcxpczOEGBKjFSwRfe8GGWlM56nDED8+9nI/s9ptQjQhada3CnSx4wSV7Od8/zm5MP9x9nQ1XHv0/jeZjXxwc/QxZeXsXq4upg/+Is+3z+VdxU4dXlt1k1O0p/fKrieH5kb/H9RhBEmipWGmiyN/aY08GT0mXnjxOzOtTeaHVgj2Sq/QpTLek9Gv+usXlrqclaoyj5aNN1uh8Mg3ckY9qQOy2FdfYc9u+gvU5TWWLvtifIj8zWgaq6NHKLiGmzIVQqnO4GYTAkQmZYsFSTVMlKoyItohEz2ORa0WQLe+00fRvsWvRjQIbpcrEl1tlt3F7wnmhFOzUbMvDB1hxyZgyqvS20np/Lc0iYyPBXwPtApiWXqswZ9attb9fzc8DhMxL5NgzXLut7KzH9yFJJinpb+P8fb8Xw7ZotqWGPqsrW1U733/wi0hZ8U9+rhoTjGGY2sECIc8Y1tAUPtg00lLKob1lR6FXDdP2S6FpQsG82fvY1tM8d1dcNdRoGYZM/V/gbtkYtUCW1lootmBh7iZCi5nKpvcmm4l7DthTXrdDpfmPFgW27667rTjXcKsmfaNvDlglACFwrZtB+NBPQUu20y+xERYUDsDPKQhPQWCZ2DiHYnCBUzOT20LNp8CAxRrF0aW1SgMmxo7R6A3eNnZ9aFhgUcvGqr/D1Ye9xItKOTDtB3Sj/B71Ig5viBQAA

The issue specifically is that JSPM relies on packages represented as folders which are chunked optimized packages, whereas this project relies on modules being single files without internal chunks for shared libraries between exports entry points.

Until this project migrates to supporting folder-based third-party JS packages over file based, these types of issues will continue to be found. JSPM does offer a download API in https://jspm.org/cdn/api#download, and if anyone is interested in implementing this I'm happy to advise.