Importing esm2015 in deno

Question

Named import from UMD module (arent UMDs supposed to work in browsers and Deno seems similar to a browser?):

import { range } from "https://unpkg.com/@reactivex/[email protected]/dist/global/rxjs.umd.js";
import { operators } from "https://unpkg.com/@reactivex/[email protected]/dist/global/rxjs.umd.js"; 

results in

error: Uncaught SyntaxError: The requested module 'https://unpkg.com/@reactivex/[email protected]/dist/global/rxjs.umd.js' does not provide an export named 'operators'
error: Uncaught SyntaxError: The requested module 'https://unpkg.com/@reactivex/[email protected]/dist/global/rxjs.umd.js' does not provide an export named 'range'

also importing directly from ES2015

import { range } from "https://unpkg.com/@reactivex/[email protected]/dist/esm2015/index.js";
import { filter, map } from "https://unpkg.com/@reactivex/[email protected]/dist/esm2015/operators/index.js";

appears to be working, loads a lot of internal modules and then crashes:

Download https://unpkg.com/@reactivex/[email protected]/dist/esm2015/internal/observable/fromEvent
/// downloads 150 internal modules
Download https://unpkg.com/@reactivex/[email protected]/dist/esm2015/internal/util/Immediate.js  // 5 minutes later
error: Import 'https://unpkg.com/@reactivex/[email protected]/dist/esm2015/internal/symbol/observable.js' failed: 500 Internal Server Error
    at https://unpkg.com/@reactivex/[email protected]/dist/esm2015/index.js:4:0

RxJS seems a fairly well maintained library - I don't suppose it's incorrectly packaged, but since it does start to download internal es2015 modules I assumed the import is done correctly

---

UPDATE: UMD usage remains unsolved, it's still unclear how 'dist/global/rxjs.umd.js' works

Answer 1

There is documented somewhere -- can't find the reference -- that unpkg breaks esm2015 packages into subpackages (esm2015/operators/index.js)

Could not find a way to import from UMD, however:

// @deno-types="https://unpkg.com/[email protected]/index.d.ts"

//unpkg
import { range } from "https://unpkg.com/@reactivex/[email protected]/dist/esm2015/index.js";
import { filter, map } from "https://unpkg.com/@reactivex/[email protected]/dist/esm2015/operators/index.js";

// skypack or pika.dev
import { range }from 'https://cdn.skypack.dev/rxjs';    // WORKS!!!
import { map, filter }from 'https://cdn.skypack.dev/rxjs/operators';

// jspm
import { range } from "https://jspm.dev/npm:[email protected]";   // WORKS!!!
import { map, filter } from "https://jspm.dev/npm:[email protected]/operators";

// code to verify imports work properly
range(1, 200)
  .pipe(
    filter((x:number) => x % 2 === 1),
    map((x:number) => x + x)
  )
  .subscribe((x:number) => console.log(x));

/*
2
6
10
14
...
390
394
398
*/

Needs further looking into:

• https://cdn.esm.sh => "esm.sh will polyfill the node internal modules(fs,os,etc) with https://deno.land/std/node to support some modules to work in Deno"
• skypack.dev seems to be able to support more features than initially thought import { range } from "https://cdn.skypack.dev/pin/[email protected]/mode=imports/optimized/rxjs.js";