jspm.dev CDN

jspm.dev provides a modules CDN that does not require import maps, useful for quick prototyping in development, as any module can be loaded directly from the console or in a module script without any other steps being necessary.

To load any npm library in the browser with module scripts with jspm.dev try for example:

<script type="module">
  // Statically:
  import babel from 'https://jspm.dev/@babel/core';
  console.log(babel);

  // Dynamically:
  console.log(await import('//jspm.dev/lodash@4/clone'));
</script>

Version URLs

To specify a specific package version target, the following URL versioning patterns are supported:

jspm.dev/pkg	Load the main entry point of a package at the latest version.
jspm.dev/pkg@1	Load the latest ^1 release of the package (includes prereleases).
jspm.dev/pkg@1.2	Load the latest ~1.2 release of the package (including prereleases).
jspm.dev/pkg@	Load the edge version of a package. This is the highest possible semver version including prereleases.
jspm.dev/pkg@tag	Load a tagged package version.
jspm.dev/npm:pkg@1.2.3 jspm.dev/pkg@1.2.3	Load an exact version of a package. The explicit `npm:` registry identifier is optional, to avoid the automatic redirect that is added for forwards compatibility with new registries in future.

Exact version URLs are cached with far-future expires, while non-exact version URLs are cached with a short expiry to allow dependency updates over time.

Note that only the version of the initial package being requested is being set this way, while the versions of deep dependencies will follow semver resolution.

Subpaths

Full subpath support is also provided for packages. It is a recommended best practice to use package subpaths where possible to load specific package features, instead of loading all package code when some of it might be unused:

jspm.dev/pkg/subpath	Load a subpath of a package - applies to all version patterns above.

Packages that have an exports field defined will expose the subpaths corresponding to the exports field. For packages without an exports field, a statistical analysis process is used to determine the subpaths of a package in code splitting optimization.

Environment Conditions

jspm.dev will always serve modules using the "development", and "browser" exports conditions.

As a result packges like React or Lit will run in their development modes, which may include a console message about this.

If needing to customize the environment, use jspm.io instead, which allows setting the conditional environment via the import map.