My first NPM package

Woke up this morning to a world that’s mostly unchanged despite publishing my first NPM package yesterday. The library is called react-leaflet-canvas-overlay and it’s a React component for React Leaflet. The library pins a canvas element on a map and it remains above the same location as you pan and zoom the map. I use a canvas on shademap.app to display the earth’s shadows in real time. I hope others find a use for it in their projects.

Moving on…

The main purpose of this blogpost is to share two cryptic errors that I ran into when running npm publish for the first time.

Make sure you are logged in #

npm ERR! code E404
npm ERR! 404 Not Found - PUT https://registry.npmjs.org/react-leaflet-canvas-overlay - Not found
npm ERR! 404 
npm ERR! 404  'react-leaflet-canvas-overlay@0.0.1' is not in the npm registry.
npm ERR! 404 You should bug the author to publish it (or use the name yourself!)

I would have expected a 401 Unauthorized instead of a 404 Not Found and that’s why it took a few minutes of Googling to discover that I was not authenticated and would need to run npm login first.

Don’t forget to verify your email #

npm ERR! code E403
npm ERR! 403 403 Forbidden - PUT https://registry.npmjs.org/react-leaflet-canvas-overlay - Forbidden
npm ERR! 403 In most cases, you or one of your dependencies are requesting
npm ERR! 403 a package version that is forbidden by your security policy.

You will see this error if you forgot to click the link sent to you by npmjs.com when you created your account. You might forget because you are automatically logged in upon account creation.