Github introduced their Github Package Registry since May 2019 - a package management service, just like NPM packages. That means you can manage private or public packages next to your source code.

At the moment when I write this article, you still have to Sign up for the beta in order to try this new service.

Here are the steps that you can follow to create your first Github Package.

Step 1: create a Personal Access Tokens

Login to your Github account > Settings > Developer settings

Step 2: log in to npm.pkg.github.com

dnguyen:~ dalenguyen$ npm login --registry=https://npm.pkg.github.com
Username: GitHub-username
Password: your-personal-access-token
Email: (this IS public) your-email@example.com
Logged in as dalenguyen on https://npm.pkg.github.com/.

Step 3: prepare your source code

I already created a TypeScript Package Starter. You can clone it from Github.

git clone https://github.com/dalenguyen/typescript-package-starter.git

Here is the project structure:

dist 
--index.js
src
--index.ts
test
--index.spec.ts

This package has only one simple function: helloWorld

export const helloWorld = () => 'Howdy!'

In order to publish your package to Github Package Registery, you need to add publishConfig. Otherwise, it will publish the package to the NPM Package Registry.

{
  "name": "typescript-package-starter",
  "version": "1.0.0",
  "description": "TypeScript boilerplate for NPM or Github Packages",
  "main": "dist/index.js",
  "types": "dist/index.d.ts",
  "scripts": {
    "test": "mocha --timeout 60000 --exit -r ts-node/register test/**/*.spec.ts",
    "build": "tsc",
    "deploy": "npm publish"
  },
  "author": "Dale Nguyen",
  "license": "ISC",
  "repository": {
    "type": "git",
    "url": "git+https://github.com/dalenguyen/typescript-package-starter.git"
  },
  .........................
  "publishConfig": {
    "registry": "https://npm.pkg.github.com/@dalenguyen"
  }
}

This will end up creating a package name: @dalenguyen/typescript-package-starter. You need to replace the username in the package.json when you work with your own package.

And thanks to Alex — my coworker — by adding the repository, you have the ability to publish multiple packages to the same GitHub repository.

Step 4: push your project to Github repo

After you have your code ready. Push it to your github repo. You have to create your repo from Github.com.

git init
git add .
git commit -m "Create first github package"
git push origin master

Step 6: publish your first Github package

Run the test, make sure that everything works

npm test

Deploy your first Github package

npm run build && npm deploy

and Voilà

Step 7: Try to install your first Github package

Before that, you need to create a .npmrc file

// .npmrc
@your-username:registry=https://npm.pkg.github.com

Then install your package:

dalenguyen$ npm i @dalenguyen/typescript-package-starter

npm notice created a lockfile as package-lock.json. You should commit this file.
npm WARN github-packages@1.0.0 No repository field.
+ typescript-package-starter@1.0.0 (as @dalenguyen/typescript-package-starter)
added 1 package from 1 contributor and removed 6 packages in 2.375s

Step 8: Test your new created package

// index.js
const starter = require('@dalenguyen/typescript-package-starter')
console.log(starter.helloWorld())

Run the index.js file

dalenguyen$ node index.js
Howdy!

Now you know how to create and publish your first Github package. In the next post, I will try to add CI/CD in order to publish the package automatically with Github Actions.