npm vs. npx: What’s the difference?

When working with JavaScript or Node.js, chances are you’ve come across npm, the Node Package Manager. It’s the go-to tool for managing packages, installing dependencies, and making sure your project stays up-to-date with the libraries it needs. But then there’s npx, another tool bundled with npm, which often sparks the question: what is the difference between the two?

At first glance, both npm and npx seem to help you interact with Node.js packages, but they serve different purposes. In this article, we’ll break down the key differences between npm and npx, show you how they work, and explore when to use each one.

Whether you’re setting up a new project, running a script, or simply curious about when to use npm versus npx, this guide will help you make sense of both tools and how they can fit into your development workflow.

What is npm?

npm stands for Node Package Manager, and it’s exactly what it sounds like — a tool for managing Node.js packages. Every time you need a new “package” for your project, you’ll turn to npm to help you install it. These packages can range from small utility functions to full-fledged frameworks and libraries.

But npm isn’t just for installing libraries. It’s also great for managing project dependencies and scripts. If you need to lock specific versions of a library to prevent breaking changes, npm has you covered. It also lets you define scripts in your package.json file to automate common tasks like testing or building your project.

How npm works

Think of npm as a digital store for software components. When you start a new Node.js project, you’ll need various tools and libraries to build it. Instead of reinventing the wheel, you can use npm to fetch and install these pre-built packages. It works by maintaining a vast online registry of packages, each with its unique name and version.

When you use the npm install command, npm downloads the specified package and its dependencies, placing them in a local directory named node_modules, a central place where all project dependencies and versions are tracked. A local installation means that the package will be available only within the project where you install it. The command looks like this:

npm install <package-name>

For example, if you want to add the cowsay library to your project, you would type:

npm install cowsay

This directory is then accessible to your project, allowing you to use the package’s functionalities in your code. A global installation makes a package available to your entire system, so you can use it for any project. This is useful for command-line tools that you want to run from anywhere.

Beyond simple package installation, npm also offers version control for each package, which lets you specify the exact versions you want. This is critical for avoiding potential issues caused by breaking changes in newer versions.

Additionally, npm provides a way to define scripts within package.json — these are commands that automate tasks like starting a server, running tests, or building a project. In your package.json, you might define a script like this:

{
  "scripts": {
    "start": "node index.js",
    "test": "jest"
  }
}

By using these features, npm helps streamline workflows, making dependency management and task automation more straightforward and organized for JavaScript developers.

What is npx?

npx was introduced with npm v 5.2.0. While npm is all about installing and managing packages, npx is about running them.

Think of npx as a quick command runner that lets you execute Node.js packages without installing them. npx is particularly useful when you want to use a package just once or test it out without permanently adding it to your system.

Before npx, if you wanted to use a command-line tool from a package, you’d have to install it globally first. npx simplifies this by allowing you to run the tool directly from the npm registry without the need for a global installation.

How npx works

When you run a command with npx, it first checks your local node_modules directory. If the package is found there, it’s executed. If not, npx temporarily installs the package, runs it, and then removes it. This means you can use a wide range of tools without cluttering your system.

Let’s say you want to use create-react-app to start a new React project. Normally, you’d have to install it globally first:

npm install -g create-react-app

Then, you’d run:

create-react-app my-app

But with npx, you can skip the global installation and run it directly:

npx create-react-app my-app

This command downloads create-react-app, runs it, and discards it when you’re done. It’s fast and convenient and keeps your system from getting cluttered with global packages you might only use once.

If you’ve already installed a package locally in your project, npx can help you run it without needing to specify the full path to node_modules. For instance, if you’ve installed Jest locally for testing, you can run it with npx like this:

npx jest

npx automatically finds the package in your local node_modules folder and runs it, saving you time and hassle.

I think npx’s coolest feature is its ability to figure out which package or command you’re trying to run. It follows a three-step process to decide how to execute any command:

• Check locally: npx first checks if the package is installed locally in your project’s node_modules folder. If it finds the package, it runs it from there
• Check globally: If the package isn’t found locally, npx checks if it’s installed globally on your system. If it finds the package globally, it runs it
• Fetch from npm registry: Finally, if npx doesn’t find the package either locally or globally, it fetches the package from the npm registry, runs it, and then removes it after execution

N.B., by default, npx will run the latest version of a package but if you need a specific version, you can also tell it which version to run.

Key differences between npm and npx

npm and npx are both crucial tools in the Node.js ecosystem, but they have different roles on different levels:

Feature	npm	npx
Purpose and functionality	Primarily used for installing packages from the npm registry and managing dependencies in Node.js projects. It helps in adding, removing, and updating packages, and maintaining package versioning	Designed to execute Node packages directly without needing to install them globally. It allows users to run packages without cluttering the global or project-specific node_modules
Package installation	Installs packages locally or globally	Executes packages temporarily without installing them permanently
Temporary usage	Installation with npm persists until explicitly removed. Packages remain in node_modules or globally installed paths	Runs packages temporarily and discards them after execution unless otherwise specified
Usage	npm install <package>	npx <package>
Script setup	Requires modifications to package.json to create custom scripts	No modifications needed in package.json for running commands
Execution of CLI tools	Must install CLI tools globally or locally before using them	Can run CLI tools directly from the npm registry without prior installation
Project setup	Typically used for project setup involving multiple dependencies and versions.	Ideal for quick project scaffolding or one-time command execution, like create-react-app
Node.js compatibility	Bundled with Node.js for general project and package management	Included with Node.js starting from v 8.2.0, streamlining the execution of packages

Conclusion: When should you use npm vs. npx?

Deciding when to use npm or npx depends on the task and your project’s needs.

You should use npm when you need to install and manage project dependencies that are crucial for development or production. Because npm ensures packages are listed in package.json, you get total control over versioning and consistency within your project. It’s also the go-to tool for running scripts defined in package.json, making it ideal for tasks like building, testing, or running your server.

On the other hand, npx is best for quick, one-off commands or testing tools without the commitment of a global installation. If you want to use a tool just once — like create-react-app for bootstrapping a React project — npx lets you run it directly without cluttering your system. It’s also handy for running locally installed packages without typing out the full path, simplifying your workflow. In short, use npm for long-term dependency management and npx for temporary tasks or running packages on the fly.