Node第六章(npx的使用)

菠菜707
284 阅读4分钟

npx

为什么需要要npx?

  • 在package.json我有以下配置，我安装了vite的依赖
"devDependencies": {
    "vite": "^6.2.5"
  }
  • 我想查看一下我安装的vite版本是否跟安装的一致，当我执行的时候vite -v
    • 我居然报错了？

image.png

  • 但是我node_modules里面有vite的依赖为啥会报错呢？

    • 其实这是跟操作系统查找有关，当我执行某个命令他会查找当前目录下是否有可以执行的文件，如果没有他会去全局的node_modules文件去查找，如果全局没有就会报错

    • 我现在在项目文件下我的全局vite版本是5.x.x的版本我项目的vite是6.2.5的版本,当我执行vite -v 他会打印全局的vite版本5.x.x 而不是项目版本

    • 那我想执行项目中的vite咋办呢？(三种方法)

      • 第一种：在node_modules文件夹目录下有一个bin目录,在bin目录下去执行vite命令,这样就会执行项目中的vite，这样就不会执行全局node_modules中的vite (不推荐)

      • 第二种方式就可以执行 npx vite 这样去执行vite命令

      • 第三种方式写在package.json文件中的script 对象中直接写

       "scripts": {
  // "build": "npx vite"  // 其实这里我们可以省略 npx 直接这样写
  "build": "vite"  // 这样写就相当于 npx vite 
 }

npx作用是什么

  • npx 是命令行工具，它是npm.5.2.0新增的一个命令行工具，它允许用户在不安装全局包的情况下，去执行本地项目安装的包和远程仓库里面的包
  • npx的作用是在命令行中运行node 包可执行的文件，而不需要全局安装这些包
    • 可以使开发人员更轻松地管理包的依赖关系，并且可以避免全局污染的问题.
    • 它可以帮助开发人员在项目中管理不同版本的包，而不会出现版本冲突的问题

npx的优势

  • 直接执行node_modules/bin 里面的命令
  • 不用去全局安装包 可以直接使用npx 去执行远程仓库里面包的命令
  • 如果本地node_modules/bin没有该执行程序npx每次执行远程仓库里面的命令 默认都是最新的包

注意：npx不能执行 package.json文件中的 scripts里面自定义的命令，npx主要用于执行在node_modules/.bin目录下的命令或者从npm仓库中下载包并执行

npm和npx区别

  • npm 侧重去管理包 比如 安装 更新 删除包 执行某种命令需求自定义
  • npx 侧重执行某个模块的命令 ，虽然会安装某模块但是安装完成就会删除，不会占安装内存
    • 自动删除：默认情况下，npx 在下载并执行完命令后，会删除临时下载的包
    • 缓存保留：虽然临时文件被删除，但下载的包仍会保留在npm 全局缓存目录中（如 ~/.npm），以便后续快速复用。若需手动清理缓存，可运行 rm -rf ~/.npm/_npx

示例1 使用react脚手架

create-react-app.bootcss.com/docs/gettin…

例如创建一个react项目 在之前需要安装到全局

npm install -g create-react-app

然后执行 create-react-app my-app 这样的话会有两个问题

  • 首先需要全局安装这个包占用磁盘空间
  • 并且如果需要更新还得执行更新命令

我们可以直接执行npx create-react-app my-app

  • 首先会去下载 create-react-app
  • 当下载完成之后 会创建项目
  • 创建项目完成会自动删除 create-react-app 不会占用磁盘空间

示例2 在项目中使用vite

npm ls -g //查看全局安装的包

当前项目安装vite

npm i vite -D

安装完成之后发现无法执行运行vite命令

这时候就可以使用npx vite 了

npx执行规则顺序

npx 的运行规则和npm 是一样的 本地目录查找.bin 看有没有 如果没有就去全局的node_moduels 查找，如果还没有就去下载这个包然后运行命令，然后删除这个包

npx命令参数

--no-install
  • --no-install 告诉npx不要自动下载，也就意味着如果本地没有该模块则无法执行后续的命令
    npx --no-install create-react-app my-react-app  // 如果没有 not found: create-react-app
--ignore-existing
  • --ignore-existing 告诉npx忽略本地已经存在的模块，每次都去执行下载操作，也就是每次都会下载安装临时模块并在用完后删除。
     npx --ignore-existing create-react-app my-react-app
-p
  • npx 默认是安装最新的 -p 用于指定npx所要安装的模块，它可以指定某一个版本进行安装：
npx -p   create-react-app@3.1   my-react-app
  • -p 还可以用于同时安装多个模块
npx -p axios -p vue-router
-c

npx的-c参数允许您在命令行中直接执行一段代码。例如，如果您想要使用npx来执行一段Node.js代码，

npx -c "node -e \"console.log('Hello, World!')\""
avatar
文章
阅读
粉丝