What’s npx?

Recently I was looking at create-react-app and came across this command

npx create-react-app my-app

So the question is, what is npx?

It’s a binary file that executes the npm package in order to improve the developer’s experience with the command line tools provided in the package.

So why introduce npx? In the past, when we used the create-react-app scaffolding to create a project, we did it like this

npm install -g create-react-app
create-react-app my-app

With npx, we just need to execute the command

npx create-react-app my-app

This command installs the create-react-app package temporarily. create-react-app will be deleted after the command completes, and will not appear in global. By default, npx will automatically look for the executable in the current dependency package, and if it can’t find it, it will look in the PATH. If it doesn’t find it, it will look for it in the PATH. If it still can’t find it, it will install it for you! Generally, we execute a script in the project by placing the script in package.json, e.g., create-react-app.

"scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },

Executing react-scripts start by running npm run start actually executes the node_modules/.bin executable. So this command is equivalent to npx react-scripts start. Since configuring scripts is already a familiar way of doing things, it’s still recommended to write the commands you use in your project in scripts. For one-off operations, such as init create-react-app, it is recommended to use npx.