Introduction

In this tutorial, you will learn how to create an NPM package from scratch. All NPM packages are by default uploaded to third-party CLI tools such as yarn and pnpm. They both fetch their packages from the NPM registry.

Prerequisites

To create a new and creative npm package, you will need to have a strong understanding of JavaScript. For the sake of this article, you only require a basic understanding.

Note that making a larger project will require a larger knowledge of JavaScript.

Initializing The Project

Just like any project, you have to initialize it. Run

npm init -y

It should automatically setup the project for you.

Your First File

Now, create a file labeled index.js. This file is the root file and will automatically be executed when you run node ..

Root Directory Change

This part is for those new to npm. You can change the name of the root file straight from the package.json file. The package.json file is a auto-generated by npm and is used to keep track of your project details and dependencies. You can simply edit the main file by editing the JSON value called "main".

"main": "index.js"

Now, where it says index.js, you can change it to any JavaScript file in your project directory.

Only JavaScript files can be marked as the root file. Other files such as TypeScript are not natively supported.

How a package works

An npm package is honestly the same as importing a file where you've exported a function. But, instead of writing the function yourself, you're using a function that someone else wrote. Doing this saves you plenty of time. For example, imagine a made-up company called Acme Games. This massive corporation is the developer and publisher of the famous new game, FaceTime Of Duty. They have released a new battle royale mode and created an API to track user statistics. Instead of reading documentation for the API and implementing it yourself, you realize that someone else took the time and effort to make a helpful wrapper for their API. All you'd have to do is install their package, and import it into your project.

Now, instead of being the person who just uses random packages from the internet. You get to be on the other side, making the packages for someone to find randomly on the internet.

Basic Print Method

Now, since this is a basic tutorial, you will be creating an npm package that prints a message to the console.

const print = (message) => {
  console.log(message);
}

module.exports = {
  print
}

Let me explain this code. You create a function, passing the parameters message and are using console.log to print it into the terminal. After defining the function, you export the function.

That's it. The main code for the entire project is done.

Testing your package

To test your package, you will need to run the npm link command.

Go your project terminal, and run the command npm link. Then, create a new folder in the root directory called test. CD into the test directory and run:

npm init -y

Inside the same directory run

npm link test-package

But, replace the test-package with the name of your project found inside package.json. This should install your package inside the test directory. This isn't officially published to the npm registry. From now on, if you update the root directory with new code, it will automatically update inside the test directory. This means, you don't have to run the link command every time you update your code (thankfully).

Now, you can import the package as you normally would and run the function.

const test = require("test-package");

test.print("hello world")

Console:

hello world

🎉 Publish time

Great! You've written all the code for the project and it's time to publish. The package will be published to the name you have in your package.json file.

Just run npm publish and your package will be published!