DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’»

Gulnur Baimukhambetova
Gulnur Baimukhambetova

Posted on

How to publish your project to npm?

Hello everyone!

Today, I created the first release for my SSGulnur tool.

Releases πŸš€

As you are building your tool, it is alright to store it on the GitHub and apply it by cloning the repo, building and running it locally following the pre-requisites and instructions outlined in the README file.

However, when it comes to the actual users, not everyone knows how to do it, so it is better to provide releases which are easy to understand, download and use.

For that, I am going to publish my project to the registry so that it can be installed by name.

npm πŸ—ƒ

As my project is using node.js, my obvious choice of release and package manager was npm.

Approach πŸ‘©πŸ»β€πŸ«

It does not require much to just publish a package. You can do it by only running the npm publish command, however it will be missing some of the industry standard procedures.

For example, it will not ensure that you are using Semantic versioning (Semver for short) or associate a git tag for each update.

If you do not know what Semver is, I have a brief explanation at the end of the post.

Therefore, we will be using a tool called np, which will

  1. run the tests (if there are any)
  2. update version in package.json according to Semver
  3. create a git tag according to Semver
  4. push the package to Github
  5. push the package to npm
  6. create release notes for every update

all in one command.

Steps πŸ“œ

In order to use np there are a few requirements (which you most probably have already met):

  1. Project needs to be a Git repository:
    • It needs to have a remote.
    • You must have pushed to the remote at least once.
    • You also need to make sure your working directory is clean.
    • You set up ssh authentication keys
  2. You need to have an npm account

All you have to do is:

  1. Navigate to your projects folder and open a terminal.
  2. Login to your npm account using npm login
  3. Install np globally npm install --global np
  4. Run np and follow the prompt

semver

process

  1. Optional: add script in package.json for releases using np.
"scripts": {
    ...
    "release": "np"
  },
Enter fullscreen mode Exit fullscreen mode

Tadaaa πŸŽ‰

Now, you should have an npm package as well as associated tags and releases on GitHub.

So, my tool can be installed by only using npm i ssgulnur.

My resulting npm package:
https://www.npmjs.com/package/ssgulnur

GitHub releases:
https://github.com/gulyapulya/SSGulnur/releases

TADA

Semver πŸ’‘

Now, lets talk a little bit about the versioning. Semver is a simple set of rules and requirements that dictate how version numbers are assigned and incremented.

The ideas is that three numbers are used to explain the version and one of them gets incremented depending on how big the change has been.

So the version is structured as MAJOR.MINOR.PATCH and you increase:

  • MAJOR version when you make incompatible changes (some previous logic cannot be used anymore)
  • MINOR version when you add functionality in a backwards compatible manner (new features that do not break the previous logic)
  • PATCH version when you make backwards compatible bug fixes

Top comments (4)

Collapse
 
tdaw profile image
TD

Great tutorial! 😁
I ended up using NP to publish my package to NPM as well. It simplifies the whole process.

Collapse
 
gulyapulya profile image
Gulnur Baimukhambetova

Yes, glad my post helped! ☺️

Collapse
 
mnosov622 profile image
Maxim Nosov βœͺ

Thank you for sharing, Gulnur !

It was very interesting to read :)

Collapse
 
gulyapulya profile image
Gulnur Baimukhambetova • Edited on

Thanks! Your post was also a great quick overview of the general method.

Stop sifting through your feed.

Find the content you want to see.

Change your feed algorithm by adjusting your experience level and give weights to the tags you follow.