我是靠谱客的博主 潇洒微笑,最近开发中收集的这篇文章主要介绍npm的使用以及npxnpm 命令,觉得挺不错的,现在分享给大家,希望可以做个参考。

概述

npm 命令

npm 的使用

初始化

npm init 交互式初始化需要回答一系列问题。npm init -y 使用默认值,直接初始化。

安装依赖

npm支持一下几种依赖:

依赖类型安装命令说明
dependenciesnpm i [-P] [package-name] 不提供-P同时没有其他参数的时候,默认也是这个运行时依赖例如 vue
devDependenciesnpm i -D [package-name]开发时依赖 例如 webpack eslint
peerDependencies手动添加同等依赖,需要宿主提供的依赖,例如开发webpack插件的时候需要将webpack设置为同等依赖。发布的插件中不需要打包webpack,使用插件的时候npm会检测用户是否已经安装了webpack。
optionalDependenciesnpm i -O [package-name]可选依赖,有些依赖存在则调用并执行不存在则执行其它逻辑不影响正常使用的,就可以放在这里,可选依赖和运行时依赖互斥不要同时填写。运行时依赖会被覆盖。
bundleDependenciesnpm i -B [package-name]打包依赖,需要打包到最终产物中的依赖。

npm 依赖版本管理

  • ~ 会匹配最近的小版本依赖包,比如~1.2.3会匹配所有1.2.x版本,但是不包括1.3.0
  • ^ 会匹配最新的大版本依赖包,比如^1.2.3会匹配所有1.x.x的包,包括1.3.0,但是不包括2.0.0
  • * 安装最新版本的依赖包

  默认安装的时候使用^,可以使用npm config set save-prefix="~"命令修改默认值。也可以使用npm config set save-exact true命令保证npm每次仅安装精确版本号,或者在安装依赖的时候使用 npm i -E [package-name]命令可以直接安装精确的版本号。

查看npm包的最新版本

npm view grunt version

npm应用命令行中的参数

{
	"script":{
		"test":"git checkout %npm_config_branch%"
	}
}
npm run test --branch=dev

npm 命令中引用package.json 中的数据

{
	"name": "xxxx",
	"script":{
		"test":"git checkout %npm_package_name%"
	}
}

npm script

并发执行

两个命令一起执行

npm run aaaaa & npm run bbbb

顺序执行

顺序执行,第一个成功再执行第二个

npm run aaaa && npm run bbbb

pre和post两个钩子

npm 脚本都有有pre和post两个钩子

{
  "scripts": {
    "prebuild": "echo 1",
    "build": "echo 2",
    "postbuild": "echo 3"
  },
}

执行 npm run build的时候,相当于执行npm run prebuild && npm run build && npm run postbuild

prepublish,postpublish
preinstall,postinstall
preuninstall,postuninstall
preversion,postversion
pretest,posttest
prestop,poststop
prestart,poststart
prerestart,postrestart

prepare, prepublish, prepublishOnly, prepack, postpack, dependencies

pnpm与 npm run的不同之处
默认情况下, pnpm 不会任意执行用户定义的 hook,pre 和 post (例如 prestart)。 这种从npm继承过来的习惯,会导致脚本执行是隐式的,而不是显式的,从而混淆了执行流程。 它还会导致意外执行 pnpm serve 和 pnpm preserve。
如果出于某种原因,需要 npm 的前置、后置钩子脚本,可使用enable-pre-post-scripts 选项。

npm ci

npm ci
aliases: clean-install, ic, install-clean, isntall-clean

npm ci命令触发的相关钩子以及执行顺序执行顺序

  • preinstall
  • install
  • postinstall
  • prepublish
  • preprepare
  • prepare
  • postprepare

npm i 和 npm ci 触发的钩子是一样的

npm cinpm i作用类似,npm ci 是给自动化流程使用的,
两者的差别在于:
执行npm ci的时候:

  • 项目必须包含package-lock.json 或者 npm-shrinkwrap.json
  • 如果 package-lock.json中的依赖的版本和package.json中的版本不匹配,npm ci 将会退出并报错而不是更新package-lock.json文件。
  • npm ci 只能一次性安装整个项目的依赖不能用来安装单个依赖。
  • npm ci开始安装之前如果已经存在node_modules,将会自动移除node_modules然后在开始安装。
  • 永远不会修改package.json或者package-locks文件,保持安装基本一致

pnpm 目前不支持 pnpm ci

npm pack

  • prepack
  • prepare
  • postpack

npm publish

  • prepublishOnly
  • prepack
  • prepare
  • postpack
  • publish
  • postpublish

prepare will not run during --dry-run

npm rebuild

  • preinstall
  • install
  • postinstall
  • prepare

prepare is only run if the current directory is a symlink (e.g. with linked packages)

npm restart

如果存在restart脚本则执行对应脚本,如果不存在则执行npm stop && npm start,如果有钩子也会调用对应的钩子。

  • prerestart
  • restart
  • postrestart

npm run

  • pre<user-defined>
  • <user-defined>
  • post<user-defined>

npm start

  • prestart
  • start
  • poststart

如果在项目根目录存在server.js ,package.json中没有start脚本将默认启动node server.js,对应的钩子仍然会执行。

npm stop

  • prestop
  • stop
  • poststop

npm test

  • pretest
  • test
  • posttest

npm version

  • preversion
  • version
  • postversion

npm uninstall 没有实现相关的钩子

npm 提供一个npm_lifecycle_event变量,可以访问到当前使用的命令。

console.log(process.env.npm_lifecycle_event);

关于 npx

  npm5.2 开始 加入了 npx 命令,它是 node 自带的模块。

想在命令行下直接调用一个包,有以下几种方法。

  1. 全局安装 npm 包,然后就可以直接调用了。

    >npm i webpack -g // 安装
    >webapck // 调用
    
  2. 在项目内部安装,使用路径调用

    >npm i webpack -D  // 安装
    >mode_modules/.bin/webpack 调用
    

有了 npx 之后,就可以直接使用 npx webpack来调用 webpack 了

命令行 搜索命令顺序 只搜索 系统环境变量 Path 配置

npx 搜索顺序 node_modules/.bin 目录–》 系统环境变量 Path 配置 --》 远程库

npx 在本地搜索不到相关的包的时候会自动搜索远程库,然后下载安装它到一个临时目录使用之后,再删除。

常常使用的 npx 暂时这么多。

最后

以上就是潇洒微笑为你收集整理的npm的使用以及npxnpm 命令的全部内容,希望文章能够帮你解决npm的使用以及npxnpm 命令所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(39)

评论列表共有 0 条评论

立即
投稿
返回
顶部