DEV Community

Heiker
Heiker

Posted on • Updated on

Install an NPM package from a github repository

Kids, you should always read the instructions.

Apparently you can use npm install to fetch a package directly from a git remote repository. This may not be the best thing to do in a super important enterprise app but it might be useful to download those packages that you made for personal use.

Assume you made a cli tool that you find useful but not worthy of an npm package. You probably have it on github (or somewhere else) because you don't want to lose the code but the install step go a little bit like this

git clone https://<git-host>/<username>/<repo-name>
cd repo-name
npm install

# extra steps to make it available globally
Enter fullscreen mode Exit fullscreen mode

If you are going to use it in another machine but you're not going to make any changes then there is no point in doing all of that. This is where npm (the cli tool) can help us, it allows us to fetch the source from the repository and make it available globally.

npm install --global  <git-host>:<git-user>/<repo-name>
Enter fullscreen mode Exit fullscreen mode

Want to test it by yourself? Here is something you can do. You can make a command that can pretty-print a json string.

We begin by making a tipical node.js project folder.

mkdir json-fmt
cd json-fmt
git init
echo "node_modules" > .gitignore
mkdir src
Enter fullscreen mode Exit fullscreen mode

We create our package.json.

{
  "name": "json-fmt",
  "version": "1.0.0",
  "description": "",
  "main": "src/main.js",
  "bin": {
    "json-fmt": "src/main.js"
  },
  "scripts": {},
  "keywords": [],
  "author": "",
  "license": "MIT"
}
Enter fullscreen mode Exit fullscreen mode

Pay attention the bin property, in there we specify the name of the command we want as a key and the value must be the entry point of our package.

Now we install the dependency that is going to do the heavy lifting.

npm install jsome
Enter fullscreen mode Exit fullscreen mode

Finally we create src/main.js.

#! /usr/bin/env node

// https://www.npmjs.com/package/jsome
const jsome = require('jsome');


jsome.colors = {
  num: 'magenta',   // stands for numbers
  str: 'green',     // stands for strings
  bool: 'magenta',  // stands for booleans
  regex: 'blue',    // stands for regular expressions
  undef: 'magenta', // stands for undefined
  null: 'magenta',  // stands for null
  attr: 'cyan',     // objects attributes -> { attr : value }
  quot: 'white',    // strings quotes -> "..."
  punc: 'white',    // commas seperating arrays and objects values
  brack: 'white'    // for both {} and []
};

// make it a valid json
jsome.params.lintable = true;

function safe_parse(text) {
  try {
    jsome.parse(text);
  } catch (err) {
    jsome(text);
  }
}

// get the user input
let text = process.argv[2] || '';

// parse it if present
if(text.length) {
  safe_parse(text);
}

Enter fullscreen mode Exit fullscreen mode

See this line.

#! /usr/bin/env node
Enter fullscreen mode Exit fullscreen mode

It is very important and you should not forget to add it because npm relies on that to make the script executable and available in the bin folder of your global packages. On *nix systems that line makes sure your script is execute it with the right interpreter, on windows it doesn't have the same effect but I read somewhere that when present npm install will create a wrapper around your script so it can be execute it correctly (don't know if that is actually true). Now you can uploaded it to github/gitlab/other and install it using.

npm install --global  <git-host>:<git-user>/<repo-name>
Enter fullscreen mode Exit fullscreen mode

If you want to test it without uploading it to a remote repository you can use npm install --global with the absolute path to the project directory. In the end you should be able to do this.

json-fmt '{"b":1}'
Enter fullscreen mode Exit fullscreen mode

And get.

{
  "b": 1
}
Enter fullscreen mode Exit fullscreen mode

But with pretty colors.

One last thing, kids:

Don't copy commands on your terminal if you don't know what they do.


Thank you for reading. If you find this article useful and want to support my efforts, buy me a coffee ☕.

buy me a coffee

Top comments (0)