How I published my first npm package

I thought making and publishing an NPM package isn’t easy.

No. It’s so easy! Your package doesn’t have to be very tricky, unique and awesome.

You can publish your favorite utility code and install it on your project with npm or yarn.

All I want to say is…it’s not complicated. We can do it!


e.i. The string below is the slug for this article.


How to publish

Create an account

Login via CLI

$ npm adduser
Username: your-username
Email: (this IS public) your-email
Logged in as your-username on

Great. Now you are logged in.

Then make a directory for the package.

$ mkdir slug-generator && cd $_

Now you are under the slug-generator directory.

We want to make our package scoped package to use the name (slug-generator in this case) that already is taken.
Execute yarn init to generate a package.json. You will be asked some questions so please answer them.

$ yarn init
yarn init v1.16.0
warning ../../package.json: No license field
question name (slug-generator): @taishikato/slug-generator
question version (1.0.0):
question description: generate slug string
question entry point (index.js):
question repository url:
question author: taishikato
question license (MIT):
question private: false
success Saved package.json
✨ Done in 68.06s.

Then you need to use npm publish — access=public to publish public package.

$ npm publish --access=public
npm notice
npm notice 📦 @taishikato/slug-generator@1.0.0
npm notice === Tarball Contents ===
npm notice 258B package.json
npm notice === Tarball Details ===
npm notice name: @taishikato/slug-generator
npm notice version: 1.0.0
npm notice package size: 257 B
npm notice unpacked size: 258 B
npm notice shasum: bf71ac427082c283c6d2cf600f7d1691ab0b5964
npm notice integrity: sha512-clwDAYf181ObB[...]5pwvhOJbTUAiA==
npm notice total files: 1
npm notice
+ @taishikato/slug-generator@1.0.0

All done. Too quick? But yes version 1.0.0 of your package is on npm.

But we still don’t have a README, LICENSE file, and actual code!!!


Go to to generate budgets and show how cool we are.

At first, we generate a budge to display the version of your package on npm.

Next, we got an error because we don’t have any code yet… but generate it anyway.

Make a file and paste the budgets you made.

Let’s add some code.


Choose MIT anyway.


Given a version number MAJOR.MINOR.PATCH, increment the:

  1. MAJOR version when you make incompatible API changes,
  2. MINOR version when you add functionality in a backwards compatible manner, and
  3. PATCH version when you make backwards compatible bug fixes.

We need to change the major version so use the command below.

$ npm version major


$ npm publish
npm notice
npm notice 📦 @taishikato/slug-generator@2.0.0
npm notice === Tarball Contents ===
npm notice 1.1kB LICENSE
npm notice 496B index.js
npm notice 304B package.json
npm notice 901B
npm notice === Tarball Details ===
npm notice name: @taishikato/slug-generator
npm notice version: 2.0.0
npm notice package size: 1.7 kB
npm notice unpacked size: 2.8 kB
npm notice shasum: a43b58c8d1434faaeaf207778619981d5b372bd5
npm notice integrity: sha512-u4jsqO8B7j3PY[...]kfdDVtGHT4+Zw==
npm notice total files: 4
npm notice
+ @taishikato/slug-generator@2.0.0

Add some keywords on package.json

"name": "@taishikato/slug-generator",
"version": "2.0.0",
"description": "generate slug string",
"main": "index.js",
"repository": "",
"author": "taishikato",
"license": "MIT",
"private": false,
"dependencies": {
"uuid": "^7.0.2"
"keywords": [
"slug generator"

Thank you!

It’s great for any reason.
What are you waiting for?

Let’s make a package.json and output something in this world!



On Linkedin

Trying to start a company in Vancouver