I have been watching JSR package manager (jsr.io) for a while. The premise is typescript packages published as typescript. No transpiling. It works with the current suite of popular package managers. This will be high-level and assumes knowledge of the command line, typescript, Git/GitHub, and a code editor.

Let us begin

1. Make a new directory named whatever you like. Using a bash terminal I ran the make directory command. Changed into the directory and ran deno init to scaffold the project. If you don't have Deno you can find the install instructions here https://docs.deno.com/runtime/manual/

    mkdir new-package
    cd new-package
    deno init
   

2. Next, we have some housekeeping to do. Open your code editor of choice and rename main.ts to mod.ts. Rename the test file from main_test.ts to mod_test.ts. Fix the import paths within the files. Your files should look like this at this point.

   

3. Next, we have to sign up for JSR at jsr.io. I used GitHub to sign in (this allows you to set up publish from GitHub actions easily).

4. On the home page of JSR click the publish package button. The button is located below the search bar.

   

5. You will be directed to a page with scope and package name inputs on the right-hand side.

   The scope is a namespace for your packages to live in. This is what the user of your package will use to import the package.
   The package name is used as part of the import statement.

   

6. Now it is time to set up GitHub as our source of publishing. First, we will initialise a GitHub repository through the git Command Line Interface or GitHub web UI. Once your GitHub repo is established, insert the name into the "Publish from CI" in the bottom corner.

   

7. It is time to set up the CI pipeline using GitHub actions. Once you have successfully linked your GitHub repo you should see.

   

Copy the script above and add it to a .github/workflows/publish.yml

8. Next, we need to add these lines to our deno.json (note these lines can be added to a jsr.json in another runtime)

    {
      "name": "@boxothings/test",
      "version": "0.1.0",
      "exports": "./mod.ts"
      "tasks": {
        "dev": "deno run --watch mod.ts",
        "test": "deno test --watch"
      }
    }
   

9. Finally, we will push to main on Git Hub with our new action. GitHub actions will take over and publish the package to the linked namespace on JSR. When complete you should be able to see your new package in JSR.

   

That is done. You now have a package that publishes to your own JSR namespace from GitHub on push to the main branch. We didn't have to do anything with our typescript files, it is taken care of. Libraries can now be written without the need to transpile or build steps. Overall, this is a great tool for publishing JS ecosystem-wide packages. Go forth and populate this new package manager superset.