Publishing your own npm packages

adv-lecture-npm.md

Publishing npm packages

Giving back to the open source community is rite of passage for every developer and npm is a great ecosystem for taking that leap. You don't need something worth sharing to get started though, you simply need to follow a few easy steps. We'll assume you're starting a "new" package, though in most cases packages are derived from existing applications.

1. Have a public git repostory where your source code and documentation will reside.
2. Create a folder for your package: mkdir my-package && cd my-package
3. Initialize a local git repo and sync it up: git init && git remote add origin git@github.com:User/UserRepo.git
4. Initialize an npm package with npm init. Follow the instructions on the prompt, remembering a few key things:

• The package name needs to be unique! You can check if the name is taken by running npm view <package-name>
• 1.0.0 is a bad default version for a new package unless it's already production ready. 0.1.0 is better. Check out the semver docs for more info
• Choosing a license
• The entry point file is what people actually get when they require your package!

Example package.json:

{
  "name": "very-unique-useless-package",
  "version": "0.1.0",
  "description": "A useless module for example purposes.",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "repository": {
    "type": "git",
    "url": "git+ssh://git@github.com/alex-wilmer/very-unique-useless-package.git"
  },
  "author": "Alex Wilmer",
  "license": "MIT",
  "bugs": {
    "url": "https://github.com/alex-wilmer/very-unique-useless-package/issues"
  },
  "homepage": "https://github.com/alex-wilmer/very-unique-useless-package#readme"
}

This exercise is simply about going through the motions, so let's make a module that outputs a string when you call it:

// index.js
let hello = (text = 'world') => `Hello ${text}!`

module.exports = hello // <-- this is what people get back when they `require(..)`

A README.md is highly recommended so that people know how to use your package:

---

very-unique-useless-package

Install

npm i very-unique-useless-package

Usage

let hello = require('very-unique-useless-package')

console.log(hello()) 
// Hello world!

console.log(hello('Steve')) 
// Hello Steve!

---

Once that's done you're ready to publish (almost, maybe)! From the root folder run:

npm publish

This may fail because:

• you haven't created a user at https://www.npmjs.com/ yet. Once you do that, make sure to add your user in your terminal
• your package name is already taken!

Once you've done that and it succeeds, make sure to try it out!

npm i <your-package-name>

Codesandbox is convenient for installing npm packages online and using them right away.

If your package requires some preprocessing, such as in the case of a React component, you may need to add a prepublish script to your package.json which transforms your source code into something consumable.

Example from class:

  "main": "dist/index.js",
  "scripts": {
    "prepublish": "babel index.js --out-file dist/index.js"

Remember to update your main value to reflect the destination of your importable code!