DEV Community

Cover image for Create/ Publish your first NPM package
Deep
Deep

Posted on

Create/ Publish your first NPM package

#npm #node #codenewbie

1.
Create a dir/folder to contain your packages code.

mkdir firstnpmpackage
Enter fullscreen mode Exit fullscreen mode

2.
change path to dir/folder you just created.

cd firstnpmpackage
Enter fullscreen mode Exit fullscreen mode

3.
Now run ..

npm init
Enter fullscreen mode Exit fullscreen mode

or simply(if you use this command instead npm will not ask you for the details of package and will generate it with defaults)

npm init -y
Enter fullscreen mode Exit fullscreen mode

and fill the required details.

Alt Text

4.
Now create an index.js file in this folder, your folder should look like this

    firstnpmpackage
  • index.js
  • package.json

5.
write some code in index.js

#!/usr/bin/env node
function randomNoGenerator(min, max) {
  if(typeof(max) !== 'number' && typeof(min) !== 'number') {
    min = 0;  max = 1;
  }
 console.log(Math.random() * (max-min)) + min;
}
randomNoGenerator(5,10);
Enter fullscreen mode Exit fullscreen mode

6.
Now let's modify our package.json a bit to make it work using cli.

"bin":{
   "demoproject" : "index.js"
},
Enter fullscreen mode Exit fullscreen mode

just add this thing in your package.json
demoproject is the command you will use to execute your package through cli.
index.js is the file that will be first triggered.

7.
We are all ready to go ,
but wait wait you will really want to test your package locally before publishing it.

Let's do it first :
run

sudo npm install -g ./
Enter fullscreen mode Exit fullscreen mode

Our package is installed in our local machine now,
Let run it type this in your cli and see the result.

demoproject
Enter fullscreen mode Exit fullscreen mode

Alt Text


8.
So, now we are done with testing ..
Let's publish it now ,

To make it published you first need to signup on npmjs.com

once you are done signing up!
Run :

npm adduser
Enter fullscreen mode Exit fullscreen mode

Give your login credentials..

9.
Now we are ready to go ..
open terminal in your root directory..

and Run :

npm publish
Enter fullscreen mode Exit fullscreen mode

Done.....

NOTE : if it gives any error goto package.json and change name of your project any package with same name might be published before...

my github: Deep1144
my npm account: deep1144

Follow me for more..

Top comments (2)

Collapse
 
pavelloz profile image
Paweł Kowalski • • Edited

Hint: IF you dont need details (or you use defaults) try npm init -y - it will not ask you about anything.

Ie.

devto|⇒ npm init -y
Wrote to /Users/pavel/projects/private/devto/package.json:

{
  "name": "devto",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "dependencies": {
    "jsdom": "^16.2.2"
  },
  "devDependencies": {},
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "Paweł Kowalski <pavelloz@gmail.com>",
  "license": "MIT"
}

Also,

sudo npm install -g ./ - I wouldnt recommend this. npm link was implemented to do this ;)

Collapse
 
deep1144 profile image
Deep •

Yes definitely true i will add this points in post ❤

Read next

diegoleteliers10 profile image

Haciendo tu Primer Proyecto con Deno 20

Diego Letelier -

otumianempire profile image

JavaScript Essentials: Part 7

Michael Otu -

mbarzeev profile image

I've built the TodoMVC app with HTMX and lived to tell the story

Matti Bar-Zeev -

gautamkaran profile image

URL-Shortener-APIs

Karan Kumar Gautam -