如何能分清npm,使用纪要

时间: 2019-12-09阅读: 74标签: npx

用过 npm cnpm吗?知道 npx nvm 吗?

本来打算暑假将自己每天学到的东西写下来,每天做成一篇文章的,结果现在每周能产出一篇文章就不错了。。。【掩面】。。今天学了点npm命令行操作,就写一下

Node.js ,如今已经是前端开发 不可或缺的组成部分;npm 是 Node.js 默认的、以 JavaScript 编写的软件包管理系统; 而npx 是 npm 软件包运行器 ,使用它,能够无需显式安装即可帮助执行 npm 软件包。它有很多用处,本就从其主要使用场景角度,来介绍下该命令。

npm

1.简介
npm有两层含义。一层含义是Node的开放式模块登记和管理系统,网址为npmjs.org。另一层含义是Node默认的模块管理器,是一个命令行下的软件,用来安装和管理Node模块。npm不需要单独安装。在安装Node的时候,会连带一起安装npm。但是,Node附带的npm可能不是最新版本,最好用下面的命令,更新到最新版本:

安装

npm 的全称是 Node Package Manager 是 JavaScript 世界的包管理工具,并且是 Node.js 平台的默认包管理工具,在安装的 nodejs 的时候,npm 会跟着一起安装。通过 npm 可以安装、共享、分发代码,管理项目依赖关系。

$ npm install npm@latest -g

更新 npm 至= @5.2.0,就会自动安装npx;可以通过which npx来查看其绝对路径 ;如果由于某种原因它不可用,请按照以下说明安装或更新它即可:

npm -v 显示版本,检查npm 是否正确安装npm help 可查看某条命令的详细帮助,例如npm help installnpm list -g 查看已经安装的模块npm show express 查看已经安装的模块的详情 npm cache clean --force 清除npm本地缓存npm init 初始化npm install xxx 下载包npm uninstall xxx 卸载包npm update xxx 更新包npm outdated -g --depth=0 要找出需要更新的软件包

查看版本信息:

npm install -g npx

发布一个 npm 包:

$ npm -v

存在价值

注册 && 查询: 登录:npm login 查询确认成功:npm whoami 上传包:npm publish 验证邮箱:npm adduser 换源:npm config set registry 更新:修改 version 后 npm publish

2.npm init
用来初始化创建一个package.json文件

多年来,npm 生态系统越来越倾向于将工具安装为项目本地devDependencies,而不是要求用户在全局范围内安装它们。这意味着像 mocha ,gulp 和bower这样曾经主要全局安装在系统上的工具现在可以在每个项目的基础上管理它们的版本。这也意味着,要使基于 npm 的项目启动并运行,你需要做的就是确保在系统上有node+npm,克隆Git repo,然后执行npm install和npm run xx来安装依赖以及运行命令。由于npm run-script将本地二进制文件添加到路径,这样就可以了!

cnpm

# -y表示跳过提问阶段,直接生成一个package.json文件
$ npm init -y

缺点是,这使你无法以交互方式快速、方便地调用本地二进制文件。有几种方法可以做到这一点,他们都对他们有一些烦恼:你可以将这些工具添加到你的scripts,但是你需要记住通过使用--来传递参数,你可以做使用 shell 脚本技巧alias npmx=PATH=$(npm bin):$PATH,或者你可以使用./node_modules/.bin/mocha手动路径到它们。这些都有效,但没有一个是理想的,参见如下使用命令:

cnpm 淘宝镜像,可以看成是 npm 的国内版本,下载 npm 包的速度更快。

3.npm info
用来查看每个模板的信息

npm i -D rollup ./node_modules/.bin/rollup -v #or npm i -D rollup `npm bin`/rollup -v

安装 npm install cnpm -g --registry=https://registry.npm.taobao.org。

# 查看babel模板信息
$ npm info babel-cli

npx 为你提供了我认为最好的解决方案:npx rollup是你使用本地安装所需的全部工作。如果你采取额外的步骤并配置shell 自动回退。

npx

4.4、npm search
用来搜索npm仓库

好处是,如果调用已经安装的二进制文件, npx 基本上没有开销– 它足够聪明,可以将工具的代码直接加载到当前运行的node进程中!这与此类事情的速度差不多,并使其成为完全可以接受的脚本编写工具。

npm v5.2.0 引入的一条命令。

$ npm search <搜索词>

应用场景运行项目安装的模块

npx 会帮你执行依赖包里的二进制文件,引入这个命令的目的是为了提升开发者使用包内提供的命令行工具的体验。

5、npm list
以树形结构列出当前项目安装的所有模板,以及它们依赖的模板

npx 想要解决的主要问题,就是调用项目内部安装的模块。比如,项目内部安装了打包工具rollup。调用 rollup ,可在项目脚本和 package.json 的 scripts字段里面;如果想在命令行下调用,像下面:point_down:这样使用,会更加方便。

把原来需要全局安装的包放到项目目录下安装。

$ npm list

# 列出全局安装的模板
$ npm list -global
npx rollup -v
old:npm install -g create-react-appcreate-react-app my-appnew:npx create-react-app my-app

6、npm install
node模板通过这个命令来安装,有全局安装:指的是将一个模板安装到系统目录中,各个项目都可以调用;有本地安装:指的是将一个模板下载到当前项目的node_modules子目录中,然后只有在项目目录中,才能调用这个模板。

npx 的原理很简单,就是运行的时候,会到node_modules/.bin路径和环境变量$PATH里面,检查命令是否存在。由于 npx 会检查环境变量$PATH,所以系统命令也可以调用。

临时安装 create-react-app 包,命令完成后 create-react-app 会删掉,不会出现在 global 中,下次再执行,还是会重新临时安装。

# 本地安装
$ npm install <package name>

# 全局安装
$ npm install -g <package name>
# 也可以安装github代码库地址:
$ npm install git://github.com/package/.....
npx ls # 等价于 npx ls npx which npm # 等价于 which npm

nvm

安装github代码库之前,npm install会先检查,node_modules目录之中是否已经存在指定模板。如果存在,就不会再重新安装了。

一次性调用,无需本地安装

在开发中,有时候对 node 的版本有要求,有时候需要切换到指定的 node 版本来重现问题等。遇到这种需求的时候,我们需要能够灵活的切换 node 版本,nvm 就是为解决这个问题而产生的,他可以方便的在同一台设备上进行多个 node 版本之间切换。

7、-save和-save-dev
-save:模板名将被添加到dependencies(dependencies字段指定了项目运行所依赖的模板),可以简化为-S
-save-dev:模板名将被添加到devDependencies(devDependencies指定了项目开发所需要的模板),可以简化为-D

# 开启一个本地静态服务器npx arya s# ornpx http-server

nvm 不支持 Windows,但是有替代品,也就是 nvm-windows。

$ npm install react --save
$ npm install react -S

$ npm install react --save-dev
$ npm install react -D

执行 GitHub 上面的模块源码

wget -qO- https://raw.githubusercontent.com/creationix/nvm/v0.34.0/install.sh | bash

npm install默认会安装dependencies字段和DevDependencies字段中的所有版本,如果使用--production参数,则只安装dependencies字段中的模板

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

安装完成后关闭终端,重新打开终端输入 nvm 验证一下是否安装成功,当出现“Node Version Manager”时,说明已安装成功。

$ npm install --production
# 从 gist 服务上调用命令 npx # 从 github 仓库中调用命令npx github:piuccio/cowsay hello

如果在新的终端输入 nvm 时提示:command not found: nvm,有可能是以下原因之一:

ps:
也就是说,如果你在package.json的dependencies或者DevDependencies字段里将要安装的模板名及版本写入进去了,那么当你直接敲npm install时,那么就会安装相应的模板。
如果你是用来-save和-save-dev参数,那么就会安装相应的模板,然后将参数写入到package.json的dependencies字段或DevDependencies字段中。

值得一提的是,上述gist 代码片段,是为写此篇文章,特意写来测试用(使用 npx 命令来快速生成一个标准的README.md);有了npx这个功能,即可为朋友们分享一些脚本,提供更加便捷 快捷的方式(相比之下,npm 仓库伤的脚本,发布和使用,都显得更加繁琐些;当然,你需要注意:warning:安全,请务必仔细阅读 gists 代码,如同运行.sh脚本时一样!)。

你的系统可能缺少一个 .bash_profile 文件,你可以创建一个此文件,打开复制粘贴以下代码进去,保存,然后再次运行安装命令;

8、npm update,npm uninstall
更新和卸载

指定不同版本的 node 运行 npm 脚本

export NVM_DIR="$HOME/.nvm"[ -s "$NVM_DIR/nvm.sh" ] && . "$NVM_DIR/nvm.sh" # This loads nvm[ -s "$NVM_DIR/bash_completion" ] && . "$NVM_DIR/bash_completion" # This loads nvm bash_completion
$ npm update <package name>
$ npm uninstall <package name>
npx node@12.9.1 npm -v npx -p node@12.9.1 npm -v npx -p node@12.9.1 npm run build npx -p node@12.9.1 yarn build

注意:如果你安装了 oh my zsh ,需要在 .zshrc 文件去添加以上配置信息,。

9、npm run
npm不仅可以用于模块管理,还可以用于执行脚本。package.json文件里有一个scripts字段,可以用于指定脚本命令,供npm直接调用。
比如,现在用browserify打包一个reactJs文件,scripts字段如下:

上面命令会使用12.9.1版本的 Node 执行脚本;原理是从 npm 下载这个版本的 node,使用后再删掉;在一些特殊场景,用来此法来切换 Node 版本(如测试该版本是否支持某特性等),要比一些版本管理器(如nvm)来的方便一些。

如果上面没有解决问题,打开你的 .bash_profile 文件,并添加以下代码:source ~/.bashrc,更改完记得保存更改。

{
  "scripts":{
     "bundle":"browserify jsbuildapp.js -o bundle.js"
  }
}

-p参数

nvm ls-remote 列出全部可以安装的版本号nvm install stable 安装当前最新的稳定版nvm install v10.14.0 安装指定版本nvm ls 显示所有安装的版本nvm current 查看当前版本nvm use v10.14.0 切换node版本nvm alias default v10.14.0 设置默认版本

现在输入npm run bundle就会打包这个文件

-p参数用于指定 npx 所要安装的模块,这对于需要安装多个模块的场景很有用,比如:

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

npm run命令会自动在环境变量$PATH添加node_modules/.bin目录,所以scripts字段里面调用命令时不用加上路径,这就避免了全局安装NPM模块。
npm run如果不加任何参数,直接运行,会列出package.json里面所有可以执行的脚本命令
举例来说,现在安装一个react-dom模板:

npx -p cowsay -p arya-jarvis [command]
$ npm install react-dom --save-dev

-c参数

运行上面的命令以后,会产生两个结果。首先,react-dom被安装到当前目录的node_modules子目录;其次,node_modules/.bin目录会生成一个符号链接node_modules/.bin/eslint,指向ESLint模块的可执行脚本。
然后,你就可以在package.json的script属性里面,不带路径的引用react-dom这个脚本。

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

# 将会报错npx -p cowsay -p arya-jarvis "arya ip | cowsay"

npx-c参数,可以将所有命令都用 npx 来解释。于是,下面代码就可以正常工作:

# npx -p cowsay -c "cowsay hey, bro"npx -p cowsay -p arya-jarvis -c "arya ip | cowsay"... ______________ 172.25.40.22  --------------  ^__^  (oo)_______ (__) )/ ||----w | || ||

-c参数的另一个作用是,可以把这些 npm 的环境变量带入 npx 命令,如下代码:

npx -c 'echo "$npm_package_name"'npx -c 'echo "$npm_package_version"

使用--inspect运行节点二进制文件

npx --node-arg=--inspect cowsay Debugger listening on ws://127.0.0.1:9229/....

此外,npx 还有句 shell 自动回退(shell auto-fallback)功能,可以使用与bash、zsh、fish等;倘若把 npx 配置在.zshrc文件中,当在本地找不见伴随@命令时,可以在不引用 npx 的情况下执行,配置也很简单,如果你是用的是zsh,执行如下命令即可(如果是bashOrfish,可以参见npx

  • shell auto-fallback):

    source (npx --shell-auto-fallback zsh)

具体使用效果如下示例:

ember-cli@latest --version找不到 ember-cli@latest,请尝试使用 npx...ember-cli: 3.14.0node: 12.13.0os: darwin x64

于 2019.12.10 于深圳.福田 last modify 2019.12.11

原文 -to-use-npm-npx-tutorial/

本文由澳门威斯尼人平台登录发布于Web前端,转载请注明出处:如何能分清npm,使用纪要

相关阅读