Hello,大家好!

日常开发中大家应该经常使用 npm install xxx 来安装包依赖,那是否注意到npm升级到 npm@5.2.0 之后,在 npm 二进制命令旁边安装了一个 npx 二进制文件呢?

没有 npx 命令前

在没有 npx 命令之前,我们想要执行项目中安装的可执行脚本,以安装 React 创建项目的脚手架 create-react-app 为例,通常使用下面的做法:

做法一,使用全局安装然后再创建项目:

  1. npm install create-react-app -g
  2. create-react-app test-react

缺点

  1. create-react-app 安装项目本身是一个低频次操作,全局安装不具备必要性,同时如果其它低频次工具也全局安装,势必会造成全局 path 混乱和冗余。
  2. npm 生态系统越来越倾向于将工具安装为项目本地 devDependencies ,让每个项目独立管理工具的版本,而不是都是用全局安装的固定版本。

做法二,不全局安装,需要先进入脚手架目录,再调用这个命令:

  1. npm install create-react-app -D
  2. cd node-modules/.bin/
  3. create-react-app test-react

或者将 create-react-app 命令添加到 package.jsonscripts

缺点

这样做每个项目可以安装不同的脚手架版本,但操作还是略微繁琐,同时每个项目都安装一遍脚手架工具也是不必要的。

npx 就是为了解决这些问题,下面我们来了解一下。

npx 基本用法

了解基本用法之前,我们先看看 npx 的安装。

安装

在安装完 node 以及 npm 后,会默认安装 npm 相同版本号的 npx 工具,当然也可以独立安装:

  1. npm install -g npx

执行命令

  1. npx create-react-app

使用 npx 执行一个工具非常简单,不需要提前安装 create-react-app ,直接使用 npx 就可以执行这个工具,这源于 npx 的查找流程:

  1. 先自动查找当前项目依赖包中的可执行文件,也就是 node-modules/.bin/
  2. 如果找不到,就会去全局 $PATH 中查找,所以全局安装的包不会重复安装;
  3. 如果依然找不到,就会帮你临时安装,执行完命令后再删除包。

拥有 npx 后,当我们开发一个命令,就不用让用户先安装再使用了,给用户添加负担。

常用参数

同时,npx 还有一些常用的参数:

--no-install 和--ignore-existing 参数

如果想让 npx 强制使用本地模块,不下载远程模块,可以使用--no-install参数。如果本地不存在该模块,就会报错。

  1. npx --no-install create-react-app

反过来,如果忽略本地的同名模块,强制安装使用远程模块,可以使用--ignore-existing参数。比如,本地已经全局安装了create-react-app,但还是想使用远程模块,就用这个参数。

  1. npx --ignore-existing create-react-app my-react-app

-p 参数

-p参数用于指定 npx 所要安装的模块版本。

  1. npx -p node@18.16.1 node -v

上面命令先指定安装node@18.16.1,然后再执行node -v命令。

-p参数对于需要安装多个模块的场景很有用。

  1. npx -p lolcatjs -p cowsay 'cowsay hello'

cowsay 工具会在命令行中生成羊图案和对象的文字,lolcatjs 工具会将这只羊上色

-c 参数

如果 npx 安装多个模块,默认情况下,所执行的命令之中,只有第一个可执行项会使用 npx 安装的模块,后面的可执行项还是会交给 Shell 解释。

  1. npx -p lolcatjs -p cowsay 'cowsay hello | lolcatjs'
  2. # 报错

上面代码中,cowsay hello | lolcatjs执行时会报错,原因是第一项cowsay由 npx 解释,而第二项命令localcatjs由 Shell 解释,但是lolcatjs并没有全局安装,所以报错。

-c参数可以将所有命令都用 npx 解释。有了它,下面代码就可以正常执行了。

  1. npx -p lolcatjs -p cowsay -c 'cowsay hello | lolcatjs'

-c参数的另一个作用,是将环境变量带入所要执行的命令。举例来说,npm 提供当前项目的一些环境变量,可以用下面的命令查看。

  1. npm run env | grep npm_ # 查询npm的环境变量,并筛选出以 npm_ 开头的变量

-c参数可以把这些 npm 的环境变量带入 npx 命令。

  1. npx -c 'echo "$npm_package_name"'

上面代码会输出当前项目的项目名。

npx 其它用法

使用不同版本的 node

利用 npx 可以下载模块这个特点,可以指定某个版本的 Node 运行脚本。它的窍门就是使用 npm 的 node 模块

  1. npx node@18.16.1 -v

上面命令会使用 18.16.1 版本的 Node 执行脚本。原理是从 npm 下载这个版本的 node,使用后再删掉。

使用这个包,可以直接在一个 node 环境下,使用不同版本的 node 测试开发的包是否正常运行,当然也可以使用 nvm 等 node 管理器,但是需要先切换再测试的方式效率明显不如上面的命令。

执行 GitHub 源码

npx 还可以执行 GitHub 上面的模块源码。

  1. npx https://gist.github.com/zkat/4bc19503fe9e9309e2bfaa2c58074d32
  2. # 执行仓库代码
  3. npx github:piuccio/cowsay hello

注意,远程代码必须是一个模块,即必须包含package.json和入口脚本。

本文具体参考了以下文章:

你真的会用 npx 吗❓❓❓的更多相关文章

  1. npx命令介绍

    什么是npx 第一次看到npx命令是在 babel 的文档里 Note: If you do not have a package.json, create one before installing ...

  2. npx命令

    npx命令 查了一下, 英文资料: https://www.npmjs.com/package/npx 中文资料: 什么是npx 第一次看到npx命令是在 babel 的文档里 Note: If yo ...

  3. App你真的需要么

    随着智能手机.移动路联网的普及,APP火的一塌糊涂,APP应用可谓五花八门,街上经常看到各种推广:扫码安装送东西,送优惠券.仿佛一夜之间一个企业没有自己的APP就跟不上时代了. 有时我在想:APP,你 ...

  4. [C#] C# 知识回顾 - 你真的懂异常(Exception)吗?

    你真的懂异常(Exception)吗? 目录 异常介绍 异常的特点 怎样使用异常 处理异常的 try-catch-finally 捕获异常的 Catch 块 释放资源的 Finally 块 一.异常介 ...

  5. 你真的会玩SQL吗?之逻辑查询处理阶段

    你真的会玩SQL吗?系列目录 你真的会玩SQL吗?之逻辑查询处理阶段 你真的会玩SQL吗?和平大使 内连接.外连接 你真的会玩SQL吗?三范式.数据完整性 你真的会玩SQL吗?查询指定节点及其所有父节 ...

  6. SQL Server中SELECT会真的阻塞SELECT吗?

    在SQL Server中,我们知道一个SELECT语句执行过程中只会申请一些意向共享锁(IS) 与共享锁(S), 例如我使用SQL Profile跟踪会话86执行SELECT * FROM dbo.T ...

  7. 您真的理解了SQLSERVER的日志链了吗?

    您真的理解了SQLSERVER的日志链了吗? 先感谢宋沄剑给本人指点迷津,还有郭忠辉童鞋今天在QQ群里抛出的问题 这个问题跟宋沄剑讨论了三天,再次感谢宋沄剑 一直以来,SQLSERVER提供了一个非常 ...

  8. 你真的会玩SQL吗?和平大使 内连接、外连接

    你真的会玩SQL吗?系列目录 你真的会玩SQL吗?之逻辑查询处理阶段 你真的会玩SQL吗?和平大使 内连接.外连接 你真的会玩SQL吗?三范式.数据完整性 你真的会玩SQL吗?查询指定节点及其所有父节 ...

  9. 你真的会玩SQL吗?三范式、数据完整性

    你真的会玩SQL吗?系列目录 你真的会玩SQL吗?之逻辑查询处理阶段 你真的会玩SQL吗?和平大使 内连接.外连接 你真的会玩SQL吗?三范式.数据完整性 你真的会玩SQL吗?查询指定节点及其所有父节 ...

  10. 你真的会玩SQL吗?让人晕头转向的三值逻辑

    你真的会玩SQL吗?系列目录 你真的会玩SQL吗?之逻辑查询处理阶段 你真的会玩SQL吗?和平大使 内连接.外连接 你真的会玩SQL吗?三范式.数据完整性 你真的会玩SQL吗?查询指定节点及其所有父节 ...

随机推荐

  1. 【Flutter】如何优美地实现一个悬浮NavigationBar

    [Flutter]如何优美地实现一个悬浮NavigationBar 最近写代码的时候遇到了一个如下的需求: 整体来说,底部的条是一个浮动的悬浮窗,有如下的三个按钮: 点击左边的要进入"主页& ...

  2. Python并发编程——IO模型、阻塞IO、非阻塞IO、多路复用、异步IO、IO模型比较、selectors模块、复习网络和并发知识点

    文章目录 每日测验 一 IO模型介绍 二 阻塞IO(blocking IO) 三 非阻塞IO(non-blocking IO) 四 多路复用IO(IO multiplexing) 五 异步IO(Asy ...

  3. Python基础——CPU详解

    一 五大组成单元=>三大核心组件 组成计算机五大单元可以合并成三大核心组件:CPU.IO设备.主存储器 1.控制单元+算数逻辑单元=>CPU 2.主存储器,即主記憶體 3.输入单元Inpu ...

  4. android 尺寸适配相关

    Android上常见度量单位 px(像素):屏幕上的点,绝对长度,与硬件相关. in(英寸):长度单位. mm(毫米):长度单位. pt(磅):1/72英寸,point. dp(与密度无关的像素):一 ...

  5. Avalonia 实现视频聊天、远程桌面(源码,支持Windows、Linux、国产OS)

    现在最火的.NET跨平台UI框架莫过于Avalonia了.Avalonia 基于.NET Core,因此它可以运行在任何支持.NET Core的平台上.之前基于CPF跨平台UI框架写过一个视频聊天的d ...

  6. dfs 序 O(nlogn)-O(1) 求 LCA

    学点分树,发现不会询问复杂度 \(O(1)\) 的 LCA.于是被迫递归式学习. 我们设 \(dfn_i\) 表示点 \(i\) 在 dfs 过程中第几个被访问到,把点按访问到的顺序排序得到的序列叫 ...

  7. 20.3 OpenSSL 对称AES加解密算法

    AES算法是一种对称加密算法,全称为高级加密标准(Advanced Encryption Standard).它是一种分组密码,以128比特为一个分组进行加密,其密钥长度可以是128比特.192比特或 ...

  8. springMVC---GET、POST原理

    对于 java 程序员来说,特别是遵循 restful 风格的公司,controller 层用得最多的就是 下面这几个注解了: @RequestMapping @PostMapping @GetMap ...

  9. shell解析xml文档

    需要解析的源文件: /tmp/cameralist : <?xml version="1.0" encoding="UTF-8"?><came ...

  10. 2021CSP 游记

    总结 试机日: 我天,这学校什么垃圾电脑-- 比赛日: 1. 普及考试 总体上来说题目算简单 (只是我脑残),t1简单 \(O(1)\),学了数论就行,而 t2 看懂后按题意打一遍,再优化一下: 数组 ...