npx vs npm - Learn the differences between npx and npm

Posted on Jun 17, 2022

Learn the differences between npx and npm with example use cases

Photo from Unsplash

npm stands for node package manager. It’s a CLI tool used to install Node packages on computer systems.

Packages installed with npm can then be used in your code by importing them from the node_modules folder.

But you can’t run a package from the command line without installing it as a global package.

For example, to create a React application using Create React App, you need to install the package globally first, then run the package:

# 👇 install create react app package globally
npm install --global create-react-app

# 👇 then run the program
create-react-app myApp

Sometimes, you can’t do a global install because of permission issues. You might be using a computer with restricted access where you can’t use sudo.

This is the reason why npx was created.

npx stands for Node Package eXecute. At its core, npx is an npm package runner used to execute packages without having to install them globally.

Back to the example above, you can use Create React App without installing it globally using npx:

# 👇 run create react app without installing
npx create-react-app myApp

The npx command above will run the specified package without listing it as a dependency.

By default, npx will get the latest version of the package you specified. You can also choose a different version of the package to run as follows:

# 👇 run a specific version by specifying the semver 
npx create-react-app@3.4.1 --version

Note that @3.4.1 semver is appended next to the package above. That’s how you specify the version of the package to run with npx.

And that’s all there is to npx. It allows you to run npm packages without having to install them globally.

You also don’t need to specify a package.json file as it won’t install packages as dependencies.

npx can’t run npm scripts defined in your package.json file as well. You need to use npm for that.

To summarize, here are the important differences between npm and npx for JavaScript developers:

  • npm is a package manager, used for installing project dependencies and maintain their versions
  • npm can create a package.json file by running the npm init command
  • npm can run scripts inside the package.json file like npm run dev or npm start
  • npx is used to run packages without globally installing them

npx is included with npm installation since npm version 5.2. If you have an older version of npm installed, you can get npx with npm install command:

npm install -g npx

You can see if you have npx by checking its version:

npx -v

Please note that some articles may say that npx also saves space by not installing packages globally.

This is not true as npx still downloads and installs the package you want to run on your computer.

Below, you can see that npx asks to install the first time you run a package:

But the second time you run a package with npx, the package will be run from the npx cache directory.

npx can also run locally installed package on your project’s node_modules folder.

Suppose you have installed http-server listed as dependencies inside the package.json file:

{
  "name": "n-app",
  "version": "1.0.0",
  "description": "Node app",
  "dependencies": {
    "axios": "^0.27.2",
    "http-server": "^14.1.1"
  }
}

Then you can run npx http-server from the root directory of your project. npx will look for the local installation before asking to download the package.

Now you’ve learned the differences between npx and npm.

npm is used to install and manage package versions, while npx is used to run packages directly from the command line interface.

Level up your programming skills

I'm sending out an occasional email with the latest programming tutorials. Drop your email in the box below and I'll send new stuff straight into your inbox!

No spam. Unsubscribe anytime.