DEV Community

Cover image for How to publish your own npm package - Typescript
Williams
Williams

Posted on

How to publish your own npm package - Typescript

Introduction

NPM (Node Package Manager) is a popular JavaScript package manager. It is one of the largest software registries with over a million packages. It is an excellent way for developers to share reusable code with other developers. This article will explain how to write and publish an NPM package. We will be using TSDX to bootstrap our package. TSDX is a zero-config CLI that helps you develop, test, and publish modern TypeScript packages with ease.

Initialize Our Package

npx tsdx create <Your project name>
Enter fullscreen mode Exit fullscreen mode

select basic and continue

Tsdx template selection screen

Let's write our package

// src/index.ts

class MyInfo {

  name: string;
  age: number;

  constructor(name: string, age: number) {
    this.name = name;
    this.age = age;
  }

  myName() {
    return `Hi there my name is ${this.name}`
  }

  myAge() {
    return `I am ${this.age} years old`
  }

  yearOfBirth() {
    return 2023 - this.age
  }

}

export default MyInfo

Enter fullscreen mode Exit fullscreen mode

This is a simple package that takes in the name and age when you create a new instance of the class MyInfo, The instance would have the functions in the class (myName, myAge, yearOfBirth).

We can go ahead and publish our package, Let's go ahead and publish locally for testing.

//Publish locally

npm link
Enter fullscreen mode Exit fullscreen mode

We can now make use of the above created package in our projects locally

//Make use of the package locally

npm link <Your project name>
Enter fullscreen mode Exit fullscreen mode
import MyInfo from 'Your Project name'

const myInfo = new MyInfo('Williams' , 10);

console.log(myInfo.myName()); // output: "Hi there my name is Williams"
console.log(myInfo.myAge()); // output: "I am 10 years old"
console.log(myInfo.yearOfBirth()); // output: 2013

Enter fullscreen mode Exit fullscreen mode

Publish to the NPM Registry

Now that we have our package written and tested locally, we can publish it to the NPM registry for others to use.

First, you'll need to create an account on the NPM website if you don't already have one. Once you've done that, you can log in to your account from the command line using the npm login command. This will prompt you for your NPM username and password.

npm login

Enter fullscreen mode Exit fullscreen mode

Next, navigate to the root directory of your project and run the npm publish command. This will package up your code and upload it to the NPM registry.

npm publish
Enter fullscreen mode Exit fullscreen mode

Congratulations! Your package is now published on the NPM registry and is available for others to use. They can install it in their own projects using the npm install command.

In this article, we've learned how to write and publish an NPM package using TSDX. We've covered how to create a new project, write some code, and publish the package to the NPM registry. With these tools and techniques, you can share your own reusable code with others.

Top comments (1)

Collapse
 
goldenekpendu profile image
goldenekpendu

Very nice article. I'll give this a try. Thanks for sharing 👍