Node.js npx命令详解：使用场景、参数与npm区别

npx使用教程

今晚在学习Vue-Cli时，由于突发奇想想试试最新的@4.x.x版本，但本地全局安装的脚手架版本是@2.x.x的。为了避免污染全局环境，我决定尝试使用npx命令。在此过程中经历了不少波折，为了今后能更熟练地使用npx并清晰区分它与npm指令的差异，特此整理这篇笔记。

从npm 5.2版本开始，npx命令作为内置功能被引入。如果发现环境中未包含该命令，可以手动进行安装：

npm i -g npx

总结来说：

接下来从几个典型的使用场景出发，希望能覆盖您当前的实际需求，以便直接套用。

使用场景1：想在项目中执行已安装的某个包，但因未全局安装（涉及环境变量问题）而无法直接运行。

针对此场景，有一些较为繁琐的解决方法：

在项目根目录下执行：node-modules/.bin/包对应的脚本
配置npm script：在package.json的scripts字段中将方法1添加至脚本配置中，随后即可通过执行"npm run 自定义指令"来快速运行。这本质上是对方法1的一种改进。

更优雅的方案，则是直接使用npx命令啦：

npx <包对应的命令>

# 以less编译为例： npx lessc -v # 查看当前项目下less编译器的版本

使用场景2：已全局安装某个包，但项目中又安装了该包的不同版本，此时希望使用项目本地的版本。

以我今晚遇到的实际问题为例，本地全局环境中已安装了Vue脚手架的@2.x.x版本，但我希望使用并已在本地项目目录中安装了最新的@4.x.x版本，具体操作如下：


# 已经执行过
npm i -g vue-cli@2
vue -V # vue@2.9.6
# 已经执行过

cd my-project
npm i -D @vue/cli@4
vue -V # vue-cli@4.5.13

这时，如果使用vue -V命令，会发现它调用的是全局版本，因为npm默认优先执行全局安装的包。若想使用项目本地已安装的那个版本，则需直接执行如下命令：


npx <包对应的命令>

# 以vue-cli为例:
npx vue create my-project

使用场景3：不想在全局或项目中永久安装某个包，仅希望临时使用一次。

对于此类场景，npx是必要的选择。npx会将所需工具下载至临时目录，使用完毕后自动清理。仍以Vue-Cli为例：这次我想查看React脚手架的项目文件结构，由于尚未学习相关技术，本地和全局均未安装（仅临时想利用脚手架创建一个React项目）。


npx create-react-app my-react-project #react脚手架将会在项目搭建完后自动被删除掉

使用场景4：临时使用特定版本的包（本地未安装）。

如题所示，此处以我想使用Vue脚手架的@3.x.x版本为例，尽管全局已安装了@2.x.x版本。


cd my-vue-project   # 进入我的vue项目
npx @vue/cli@3 create big-project   # 利用vue-cli的3.x版本创建一个名为big-project的项目

安装并使用特定版本：npx 包@版本号包对应的命令
--no-install 强制使用本地包，若本地未安装该包则会报错：npx --no-install vue create my-project
--ignore-existing 强制安装并使用远程模块：npx --ignore-existing vue create my-project
-p 对于一次性安装多个包，需使用参数-p：npx -p @vue/cli -p less 切记：安装多个包时务必使用 -p 参数。
-c 在一次性安装并使用多个包的场景中，若使用低版本执行npx -p vue-cli -p less lessc -v & vue -V命令，可能仅第一个命令项能正常执行（即只打印出less编辑器的版本）。npx的参数-c旨在告知npx执行指定所有命令的范围：npx -p vue-cli -p less -c "lessc -v & vue -V"，这样可确保绝对安全。注：&代表执行两个命令，|代表前面执行成功后后面命令不执行。

本节中最常用且重要的是第5点，据此总结：无论安装的包或命令数量多少（即使仅安装1个包），严格遵守npx -p 包1 -p 包2 -p 包n -c "命令1 & 命令2 & 命令n"格式一定无误。

到此这篇关于Node.js中npx命令的使用方法、场景的文章就介绍到这了，更多相关Node.js npx命令使用内容请搜索本站以前的文章或继续浏览下面的相关文章希望大家以后多多支持本站！