loading...
Cover image for Countdown Of The Top Package Registries For Deno

Countdown Of The Top Package Registries For Deno

craigmorten profile image Craig Morten ・6 min read

Deno is a cool new secure runtime for JavaScript and TypeScript that lots of great built-in features like secure by default, linting, formatting and testing.This makes it a great language for starting out and writing basic code examples very quickly and easily.

However, as you set out to start on a more complex application, you are likely not going to want to write every last piece of code from scratch! It is certainly simpler to build on some libraries others have created and tested so you can focus on just the exciting parts of the application that you want to create!

In Node most people are used to the de-facto package registry is NPM that allows them to search for and install packages into their projects using the npm CLI. So what options are available for Deno programmers?

Here I count down 6 of the best ways to install packages for Deno:

6. The internet

That's right you can just use the internet - it's not a mistake! So what do I mean by this...?

Deno's module import system mirrors that of the browser, you can import a dependency from any URL (or accessible filesystem) that returns valid ECMAScript Module (ESM) code. This means if you find a piece of code on the internet you can just import straight from the URL!

For example, say you are writing a server / web framework for Deno and you need some functionality to convert a path pattern matching syntax (e.g. /users/:id) into regex. You know that popular Node frameworks like Express use the path-to-regexp NPM module to do this, so you take a look at the GitHub repo (https://github.com/pillarjs/path-to-regexp) and see that the main code is written in TypeScript as an ESM! This means that to use the code, all you need to do is import the raw version like so:

import { pathToRegexp } from "https://raw.githubusercontent.com/pillarjs/path-to-regexp/v6.1.0/src/index.ts";

And there you have it, you have the code you need and there was no need for a package manager at all - you imported straight from GitHub code! In fact, this is exactly how the popular web framework Oak gets it's path matching logic! Check it out here: https://github.com/oakserver/oak/blob/main/deps.ts#L48.

5. NPM

Wait... I didn't think Deno supported NPM? Well you would be mostly right, Deno is not compatible, in general, with Node (NPM) packages.

There is however a Node compatibility layer being built as part of the Deno standard library that hopes to bridge the gap between Node and Deno by allowing you to use Node like APIs and also supporting a form of require so you can import NPM modules.

For example, check out the CommonJS Loading example in the package README, which demos the following:

import { createRequire } from "https://deno.land/std/node/module.ts";

const require = createRequire(import.meta.url);

// Loads native module polyfill.
const path = require("path");

// Loads extensionless module.
const cjsModule = require("./my_mod");

// Visits node_modules.
const leftPad = require("left-pad");

Supported built-ins are still somewhat limited though, so I wouldn't be overly-optimistic that you will be able to use this method to import any particularly complex NPM packages.

4. Pika

PIKA is an exciting new project which has the ambitious aims of improving web performance by 90%!

One of it's offerings is a CDN that allows you import any NPM package as a modern ESM import. Even if a package wasn't written as ESM, they'll do the work to convert it for you.

For example, this means you can just get going with something like Preact really easily by just importing it from the Pika CDN:

import { Component, render } from 'https://cdn.pika.dev/preact@^10.0.0';

The project is still a going through a lot of development, and in practice I've found that some of the more complex modules cause an error when trying to import. For example, you are currently unable to import React into a Deno project using Pika. Doing so results in the following error:

Deno error message when importing React via Pika CDN

Note that if you try to import a NPM module that relies on any Node APIs at all (or in any of it's sub-dependencies), then this solution won't work for Deno.

3. JSPM

JSPM is similar to Pika. It provides a module CDN allowing any package from NPM to be directly loaded in the browser and other environments, like Deno(!), as a fully optimized native JavaScript module (ESM).

Generally I have found JSPM to be a lot more stable than Pika, and able to successfully convert complex NPM packages to ESM.

You have likely already seen JSPM being used in other blog posts as it is currently a popular way to install React into a Deno application - for example, check out my tutorial on how to write a React SSR application in Deno.

import React from "https://jspm.dev/react@16.13.1";

As you can see in the above example, it supports importing specific versions, and you can also import from a package subpath like jspm.dev/pkg/subpath.

2. deno.land/x

Probably the most popular way to import a Deno module is to use the official DenoLand third party module registry https://deno.land/x.

Deno module creators can create a PR into the core deno website project and update the database.json with their module's details.

The registry now holds over 600 modules written for Deno, including many ports of popular Node packages which are easy to find using the search functionality.

To install a package from DenoLand registry, just add the package name, optional version and any subpaths - much like the other package CDNs.

import { superdeno } from "https://deno.land/x/superdeno@1.3.0/mod.ts";

The DenoLand registry also supports experimental importing from NPM and GitHub using a special syntax: npm:[package] for NPM and gh:[owner]:[repo] for GitHub. For example:

import { Rhum } from "https://deno.land/x/gh:drashland:rhum@v1.0.0/mod.ts";

This can make it handy to import packages that have not yet been published to the DenoLand registry.

1. x.nest.land

NestLand is a new package registry for Deno that is built on the blockchain. It is immutable, free, secure and decentralised(!) - I think it’s captured what a modern package registry for something like Deno should look like really well.

Because packages are published to the permaweb they can never be deleted, so all the major issues with NPM such as the left-pad incident, which almost brought down the entire Node ecosystem, can't happen.

Another great factor is that the NestLand registry is independent of git and any source code management platform for that matter, so you can easily publish a Deno package with nothing more than some code on your local filesystem and the Deno CLI.

To publish a package to the DenoLand registry, you just need to perform the following:

  1. Create an account to generate an API key. This isn't some sort of sign-up, you simply just provide a unique username to be associated with your publishes - no invasion of privacy or hassle!
  2. Install the eggs CLI:

    $ deno install -A -f --unstable -n eggs https://x.nest.land/eggs@0.1.4/mod.ts
    
  3. Link your API key with the eggs CLI:

    $ eggs link --key [your key]
    

    You only need to do this once and then you can setup and publish as many packages as you like.

  4. Initialize your repository for use with the NestLand:

    $ eggs init
    

    This sets up a egg.json which contains all the information required to publish your code to the NestLand registry.

  5. And finally, publish your code:

    $ eggs publish
    

    Boom! You've added your module to the registry and it's safe in the Blockchain. πŸŽ‰

You can find out more about setting up your project to work with NestLand in their docs.

So how about installing a module from the registry? Just head to the NestLand Gallery choose a package, and it will display all of the information you need including available versions, the URL to import, and lots of useful package info. Because the package files are all stored in the Blockchain, if you chain the version the README also updates for that version!

Viewing a Deno module in the NestLand gallery

You can then import your chosen module using the provided URL, for example:

import { opine } from "https://x.nest.land/opine@0.12.0/mod.ts"

That's it gang! Hope the countdown was useful! πŸš€

What's your favourite place to find and install Deno modules?

Is there something I've missed off the list?

Drop your comments and questions below!

Posted on by:

craigmorten profile

Craig Morten

@craigmorten

26 β€’ London β€’ That JS Guy β€’ JavaScript, TypeScript, React, Node, Deno, Kubernetes, Azure β€’ I also tweet stuff

Discussion

markdown guide