npm cheatsheet

In

Shortcuts

Command Shortcut Action
npm version npm -v Version
npm install <package> npm i <package> Install in node-modules
npm install --save <package> npm i -S <package> Add them to dependencies (pre-npm5)
npm install -dev npm -D Restarts the process whenever a file is modified
npm install --global<package> npm i -G <package> Global install, for all modules
npm test npm -t Run the tets script (if exists)
npm uninstall <package> npm un <package> Uninstall package
npm outdated -g --depth=0 Get the package list to upgrade
npm update <package> npm up <package> Update package

Install multiple packages in one command

1
npm i -S react redux react-redux lodash @material-ui/core

Install packages from different sources

  • Default source for npm install is the npm-registry
  • You can get it from a tarball or git
    1
    2
    3
    4
    5
    6
    7
    8
    # from git service
    npm i https://github.com/username/myrepository.git
    npm i bitbucket:username/myrepository
    npm i gitlab:username/myrepository
    ## from GitHub: userName +  from repo name (Redux)
    npm i username/myrepository
    ## from GitHub: from a branch
    npm i username/myrepository#develop

Linking Packages

  • Package linking works by creating a symlink in your node_modules folder that points to the local repository of your package. * * You can edit packages locally and the changes will be instantly available in the project using it.
1
2
3
4
5
6
7
# You have myPackage which will be used by myProject
# Go to the package folder 
cd ./myPackage
npm link
# then go to the main project folder
cd ../myProject
npm link mypackage

The npx command

  • When using sciprting tools, such as Grunt, gulp, react-create-app, react-native-cli or mocha.
  • Before NPM 5.x you had to install them either as global packages or as devDependencies. This was time-consuming, it was time consuming.
  • npx is binary which downloads an installs automatically
    1
    npx create-react-app my-new-project

Monitor and clean your project

  • Scope: to solve issues and to make the dependency tree and the final bundle size as small as possible.

  1. Check dependecy tree and which package versions have actually been installed.

    1
    2
    3
    4
    # check dependency tree
    npm list
    # only top level + global packages
    npm list --depth=0 -g

  2. dedupe your project before publishing.

    1
    2
    3
    npm dedupe
    # or you can use the shortcut
    npm ddp

  3. Overview of your outdated and missing packages

    1
    npm outdated

    3.1. If you get a lot of red rows, update to the latest possible version according to your package.json

    1
    npm update

    3.2. If you are using the caret ‘^’ in front of your versions in package.json, the major versions will not be updated (hence the yellow rows). This is good, because there might be breaking changes updating to a new major version.

3.3. If you still want to update everything to the latest version, you should do it from the main folder

1
npx npm-update-all

Documentation from the terminal

Command Action
npm repo Open the repository for a package in the browser
npm home Open the homepage
npm docs Open the documentation

Use NPM scripts

  • Fewer dev-dependencies or global dependencies to maintain.
  • No new tools for contributors and team members to learn
  • Less code and configuration.

On package.json :

1
2
3
4
5
"scripts":
{
    "test": "jest",
    "format": "eslint src --fix"
}

  • Running NPM scripts on Terminal
    Now you can run npm run format and ESLint will do its job.
    You can get the list of available scripts via npm run

    1
    2
    3
    4
    # get the list of available scripts
    npm run
    # run the script we created previously
    npm run format

  • Running NPM Scripts in VScodium
    On VSCodium, you can list all your npm-scripts in the explorer and run your scripts with a click of a button by enabling the option.

    1
    npm.enableScriptExplorer: true

Set your default values

Intialize the project and fill the default values:

1
2
3
npm config set init.author.name "Angeles Broullon"
npm config set init.author.email "AngelesBroullon@mail.com"
npm init -y

Update npm

1
npm install -g npm@latest