npx 和 npm 的区别？

Question

我刚刚开始学习 React，Facebook 通过提供 以下现成的项目 来帮助简化初始设置。

如果我必须安装骨架项目，我必须在命令行中输入 npx create-react-app my-app 。

我想知道为什么 Github 中的 Facebook 有 npx create-react-app my-app 而不是 npm create-react-app my-app ？

原文由 Paresh Maniyar 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

介绍 npx：一个 npm 包运行器

NPM - 管理 包 ，但 执行 起来并不容易。 NPX - 用于 执行 Node 包的工具。

NPX 与 NPM 版本 5.2+ 捆绑在一起

NPM 本身并不简单地运行任何包。事实上，它不运行任何包。如果要使用 NPM 运行包，则必须在 package.json 文件中指定该包。

当通过 NPM 包安装可执行文件时，NPM 链接到它们：

1. 本地 安装在 ./node_modules/.bin/ 目录中创建了“链接”。

2. 全局 安装具有从 Linux 上的全局 bin/ 目录（例如 /usr/local/bin ）或 Windows 上的 %AppData%/npm 创建的“链接”。

您应该阅读的文档

---

新PM：

可能会在某个项目上本地安装一个包：

 npm install some-package

现在假设您希望 NodeJS 从命令行执行该包：

 $ some-package

以上将 失败。只有 全局安装 的包可以通过 只 输入它们的名字来执行。

要解决此问题并使其运行，您必须键入本地路径：

 $ ./node_modules/.bin/some-package

您可以通过编辑您的 packages.json 文件并在 scripts 部分添加该包从技术上运行本地安装的包：

 {
 "name": "whatever",
 "version": "1.0.0",
 "scripts": {
 "some-package": "some-package"
 }
 }

然后使用 npm run-script （或 npm run ）运行脚本：

 npm run some-package

---

NP:

npx 将检查 <command> 是否存在于 $PATH 或本地项目二进制文件中，并执行它。所以，对于上面的例子，如果你想执行本地安装的包 some-package 你需要做的就是输入：

 npx some-package

npx 的另一个 主要 优点是能够执行以前未安装的包：

 $ npx create-react-app my-app

上面的示例将 在 命令运行的路径中生成一个 react app 样板，并确保您始终使用最新版本的生成器或构建工具，而无需在每次要使用它时进行升级。

---

用例示例：

npx 命令在 package.json 文件的 script 部分可能会有所帮助，

当不需要定义可能不常用或任何其他原因的依赖项时：

 "scripts": {
 "start": "npx gulp@3.9.1",
 "serve": "npx http-server"
 }

调用： npm run serve

---

相关问题：

1. 如何使用本地安装在 node_modules 中的包？

2. NPM：如何获取 ./node_modules/.bin 文件夹？

3. 如何使用 npm 脚本运行 js 文件？

原文由 vsync 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

npx 是一个 npm 包运行器（x 可能代表 eXecute）。使用 npx 的一种常见方法是临时或试用下载并运行包。

create-react-app 是一个 npm 包，预计在项目的生命周期中只运行一次。因此，最好使用 npx 一步安装和运行它。

如主页 https://www.npmjs.com/package/npx 中所述，npx 默认可以在 PATH 或 _nodemodules /.bin 中运行命令。

注意： 通过一些挖掘，我们可以发现 create-react-app 指向在节点环境中执行的 Javascript 文件（在 Linux 系统上可能指向 /usr/lib/node_modules/create-react-app/index.js） .这只是一个进行一些检查的全局工具。实际设置由 react-scripts 完成，其最新版本已安装在项目中。有关详细信息，请参阅 https://github.com/facebook/create-react-app 。

原文由 Karthick 发布，翻译遵循 CC BY-SA 4.0 许可协议