为什么 npx @vue/cli 可以正常执行?npx 执行的过程是怎样的

看了 create-react-app 的文档,看他们是提供了三种创建程序的方式: yarn create react-app my-appnpm init react-app my-appnpx create-react-app my-app。搞不清楚这三种形式的底层执行原理。

其中 npx 的命令最为困惑:猜测是先下载 npx 后面的包,再执行对应的 bin 命令。

但是当我执行 npx @vue/cli的时候就非常困惑, package.json中的 name 和 bin 的 key 不一致。为啥可以执行呢?
image.png

阅读 4.5k
1 个回答

NPX 的文档在这里,也可以通过 npx --help 查看 npx 的用法。

npx 会在 node_modules 中去找到正确的命令来运行(我理解是 node_modules/.bin 下的脚本)。如果没有 node_modules 或者没有在 node_modules 中找到,npx 会去 npm 库中下载推断的包,然后运行其中提供的命令。当然有时候 npx 可能会推断出一个错误的包,这时候可以通过 -p 指定包及其版本(具体看文档)。

如果 npx 自动下载了包,这些包据说是在 ~/.npm/_npx (Linux) 或者 $env:LocalAppData/npm-cache/_npx (Windows Powershell) 或者 %LocalAppData%/npm-cache/_npx (Wiondows Cmd / Windows 资源管理器地址栏)。

以 TypeScript Comile 命令 tsc 为例:

TypeScript 包提供了 tsc 命令。但是有一个叫 tsc 的包,也提供了 tsc 命令,所以直接运行 npx tsc 会找到 tsc 这个包并提示是否安装;但是如果指定了包(通过 -p--package 参数),npx 就知道该去哪个包来找了。
> npx tsc --version
Need to install the following packages:
  tsc
Ok to proceed? (y)
> npx --package typescript tsc --version
Need to install the following packages:
  typescript
Ok to proceed? (y)
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题