The best time to npm init

When should you npm init?

Most developers run npm init right after creating and navigating into a new project.

It makes sense to npm init at the start of the project because we use npm to download dependencies. Once we npm init, we can begin downloading (and saving) our dependencies.

For most projects, this workflow works.

But if you're creating an open source project, the best time to npm init is slightly later. If you npm init right after creating and navigating into the project, you'll miss out a few things.

The best time to npm init

The best time to npm init (for an open source project) is after you added a Git remote to your project. In other words, you should only npm init after you have completed the following commands:

1. git init
2. git remote add origin

If you npm init after you have added a Git remote, npm will generate three extra things in your package.json files. They are:

1. A repository property with a link to your remote repo
2. A bugs property with a link to the issues page.
3. A homepage property that links to the readme.md file.

These three properties will be displayed as metadata on the right side of the project's npm page.

These metadata are links. They let people move to your project's Github page easily from the npm page. You'll want these links for better discoverability.

The second best time to npm init

The second best time to npm init is now. If you run npm init now, it will generate the three properties I mentioned above.

Before you run npm init, make sure you rename your original package.json file to something else. This way, you can copy-paste dependencies and other changes you've made from the original package.json file to the newly generated one.

Wrapping up

The best time to npm init is after you've added a Git remote to your project. The second best time? Anytime!

---

Thanks for reading. This article was originally posted on my blog. Sign up for my newsletter if you want more articles to help you become a better frontend developer.

Comments

[Sung M. Kim]

Thanks Zell for the article.
I've always thought those package.json properties were to be added manually (, which is how I have been doing 😅) but npm init auto generating them is easier & less error prone.

I was wondering about workaround of renaming package.json mentioned in "The second best time to npm init".

Initially I thought npm init would add new props, which it did.

But then I added bad props that are to be added by npm init manually, and they weren't overwritten (tried npm init with & without --force flag) but only added a missing property, keywords.

So your flow below makes total sense 🙂

1. rename the package.json the original
2. 👉 then npm init to create a new one with correct metadata.
3. 👉 then copy over metadata
4. 👉 rename the original package.json

[Zell Liew 🤗]

This is interesting. Thanks for testing and posting your tests :)

[xXjoakinXx]

Short, clear, concise and useful ... Everything that has a good post 👏👏👏