NPM is a Package management tool for Node.js. NPM makes it easier for developers to install and Manage dependencies in projects, making it a powerful tool in modern front-end development. After [email protected], NPM is a Package management tool for node.js. Add NPX to provide some ancillary functionality. This paper mainly introduces the characteristics of NPX and the significance of its existence.

Addressing call

If an NPM package is configured with bin, there will be directives in the project node_modules/.bin to facilitate execution when the package is installed.

For example, if you add next to the project to build the SSR project, node_modules/.bin will have the next command.

If you need to call a next related command, such as querying the next version:

In the past:

node node_module/.bin/next -v
Copy the code


NPM script:

{
  "script": {
    "next-v": "node node_module/.bin/next -v"}}Copy the code
npm run next-v
Copy the code


NPX way:

npx next -v
Copy the code

When calling some of the built-in commands of the installation package, such as when testing a single file using Jest, it’s not very friendly to write NPM script and manually call commands under node_modules, using NPX is much more convenient. When addressing calls, NPX checks whether the command exists by checking the node_modules/. Bin path of the project and the system path. If not, the package is temporarily downloaded or run or used.

Executing a one-time command

For example, if the HTTP-server module does not exist locally, the system automatically downloads and installs the http-server module temporarily and starts a Web service in the current directory. This is equivalent to a one-time command.

For another example, check your website’s accessibility score:

Have you ever wanted to try some CLI tool creation project before, but you had to install it globally and then create it again, if the CLI tool was only used once? For example, when creating react projects with create-react-app, use NPX to avoid this problem and do not have to worry about upgrades, since NPX ensures that you use the latest generator or software package.

npx create-react-app my-react-repo
Copy the code

NPX will automatically install create-React-app from the registry and call it. Once the call is done, it won’t be saved in a global file, so it won’t pollute the global installation or require multiple steps. This feature is ideal for packages like generators, such as create-React-app, VUe-CLI, Yeoman, etc.

Create a VUE project using NPX
npx -p @vue/cli vue create hello-word
Copy the code

Switching node Versions

Switching Node versions using NPX in some scenarios is more convenient than using Node version management tools like NVM, Nave, and N.

$NPX [email protected] -v v0.12.8Copy the code

Execute remote module

NPX executes the package from the URL, but only if the remote code on the URL is a module, that is, it must contain package.json and entry scripts.

Commonly used parameters

-p

-p or –package defines the package to install and adds it to the running $PATH,

–no-install

Tell NPX to force the local module to use and not to download the remote module. If the module is not locally available, an error will occur.

–ignore-existing

Instead of –no-install, make NPX force the use of remote modules.

–cache

Set the NPM cache location, otherwise the default NPM cache location.

-c

Executes in the NPM run-script shell like environment and provides all the usual environment variables. If NPX has multiple modules installed, only the first item of the

argument will be executed as a command, and the rest will require the -p option.

-q, –quiet

Disallow any output from NPX itself (progress bars, error messages, installation reports), subcommand output itself will not be disallowed.

-n, –node-arg

The extra arguments provided to Node when binary is a Node script.

-v, –version

View the NPX version

The article finally

From the above we know that NPX is a tool for implementing NPM packages, which greatly improves the experience of using NPM packages. NPM makes it easy to install and manage dependencies managed in the registry during development, while NPX makes it easier to use CLI tools and other managed executables in the registry. It solved the problem that there was no convenient way to interactively call local binaries, making the development and management of projects more convenient.

Related articles:

  • www.ruanyifeng.com/blog/2019/0…
  • medium.com/@maybekatz/…