前言

npm和npx是Node.js生态中常用的两个工具，虽然名字相似，但它们的用途和适用场景是不同的。掌握这两者的差异，有助于开发者更合理地安装和执行各类js工具和依赖。

介绍

npx 是什么？

  • 定义：npx 是 npm 自带的包执行工具（从 npm@5.2.0 开始内置），用于直接运行 Node.js 包中的命令，而无需先全局或本地安装这些包。
  • 核心功能：
    • 临时安装并运行包（用完即删，避免全局污染）。
    • 自动查找本地或全局依赖中的可执行命令。
    • 支持运行远程仓库（如 npm）中的包。

npx 和 npm 的关系

  • npm（Node Package Manager）：
    • 是 Node.js 的包管理工具，用于安装、卸载、管理依赖（如 npm install lodash）。
    • 主要操作的是 node_modules 目录和 package.json。
  • npx：
    • 是 npm 的补充工具，专注于执行包中的命令。
    • 解决了 npm 需要先安装包才能运行的痛点（例如，create-react-app 这类脚手架工具）。

示例对比：

1
2
3
4
5
$ npm install -g create-react-app
$ create-react-app my-app

# 使用 npx（无需安装）：
$ npx create-react-app my-app

npx 和 Node.js 的关系

  • Node.js：
    • 是 JavaScript 的运行时环境，允许在服务器端运行 JS 代码。
    • 提供了 npm 和 npx 的运行基础（因为它们本身就是 Node.js 应用）。
  • npx：
    • 依赖 Node.js 环境才能运行（因为它是通过 Node.js 执行的工具）。
    • 本质上是 Node.js 生态中的“快捷执行器”。

npx 的典型使用场景

  1. 快速运行脚手架工具：

    1
    2
    $ npx create-react-app my-app
    $ npx degit user/repo my-project

  2. 执行本地依赖的命令：

    1
    $ npx webpack --config webpack.config.js

  3. 运行不同版本的包：

    1
    $ npx node@14 ./script.js  # 临时使用 Node.js v14

技术原理

  • 当运行 

    1
    $ npx <command>

    时：

    1. 检查本地 node_modules/.bin 是否有该命令。
    2. 若无，则从 npm 仓库临时下载包，执行后删除（除非指定 --no-install）。
    3. 若包已全局安装，则直接运行。

总结

工具 作用 与 Node.js 的关系
Node.js JS 运行时环境 基础运行时，提供执行能力
npm 包管理工具（安装、卸载依赖） 内置在 Node.js 中
npx 包执行工具（临时运行命令） 随 npm 安装，依赖 Node.js 环境

简单来说：**Node.js 让你运行 JS，npm 帮你管理代码库，npx 帮你临时执行这些库中的命令。**