关于NPM你必需要知道的经常使用命令

npm:全称node package mananger，是世界上最大规模的包管理系统，官网是这样介绍的 Build amazing things...

那我们就来看看他作了哪些惊人的事~

一.npm init

默认你们确定比较熟悉了，直接 npm init -y了事，这回咱们再来仔细看看

{
  "name": "webyouxuan",
  "version": "1.0.0",
  "main": "index.js",
  "scripts": {},
  "license": "ISC"
}

这里先声明npm的版本是6.7.0，由于个人node版本是v11.14.0

我们来逐个说说这里比较重要的字段:name、version、main、scripts、license

• name是当前包的名字，也就是最终发布在npm官网上包的名字。不能和已有的包重名哦！
• version就是当前包的版本号，主要咱们要探究若是优雅的管理版本号。
• main就是当前包的入口文件，也就是使用require默认引入的文件。
• scripts能够配置一些执行脚本。
• license是协议许可。

二.npm install

1.全局安装

npm install http-server -g

全局安装的意思很简单，就是安装的模块会被安装到全局下，能够在命令行中直接使用安装的包,其实只是在/user/local/bin目录下做了个连接，链接到 /usr/local/lib/node_modules/http-server/bin/http-server了这个文件，当咱们执行http-server这个命令时，就会调用连接的这个文件。

mac由于有权限问题，这里咱们加 sudo来执行命令

咱们能够本身来尝试写一个包，建立bin目录，新增www文件,名字叫什么无所谓啦~

#! /usr/bin/env node
console.log('关注webyouxuan哈'); // #! 这句表示采用node来执行此文件，同理shell能够表示sh

更新package.json文件

"bin": {
    "youxuan":"./bin/www"   // 这里要注意名字和你创建的文件夹要相同
},

好了，写好啦！这里咱们先不说发包的事，用一个经常使用的命令，他能够实现连接的功能：

npm link

[图片上传失败...(image-a09819-1567445632022)]

这样咱们在命令行中直接输入youxuan就能够打印出关注webyouxuan！

2.本地安装

npm install webpack --save-dev

本地安装很好理解，就是所谓的在项目中使用，而非在命令行中使用！这里咱们看到生成了一个package-lock.json文件，并且将安装的模块放到了node_modules下，而json中也新增了些内容

"devDependencies": {
    "webpack": "^4.39.3"
}

这里咱们先来简单介绍下基本的使用

--save-dev表明当前依赖只在开发时被应用，若是默认不写则至关于 --save，是项目依赖开发上线都须要的

也能够指定版本号来安装包

npm i jquery@2.2.0 # install能够简写成i

默认执行npm i会安装项目中全部须要的依赖，若是只想安装生产环境的依赖能够增长--production参数

三.package-lock文件

自npm 5以后全部的依赖包都采用扁平化管理的方式
package-lock.json 的做用是锁定依赖安装结构，保证在任意机器上执行 npm install 都会获得彻底相同的 node_modules 结果，由于package-lock.json存储了全部安装的信息。

"name": "youxuan",
"version": "1.0.0",
"lockfileVersion": 1,
"requires": true,
"dependencies": {
"@webassemblyjs/ast": { 
    "version": "1.8.5", // 当前依赖的版本
    "resolved": "https://registry.npm.taobao.org/@webassemblyjs/ast/download/@webassemblyjs/ast-1.8.5.tgz", // 从哪一个渠道安装的
    "integrity": "sha1-UbHF/mV2o0lTv0slPfnw1JDZ41k=", // 内容hash
    "dev": true,
    "requires": {
    "@webassemblyjs/helper-module-context": "1.8.5",
    "@webassemblyjs/helper-wasm-bytecode": "1.8.5",
    "@webassemblyjs/wast-parser": "1.8.5"
    }
},
....

若是手动更新了package.json文件，执行安装命令会下载对应的新版本,而且会自动更新lock文件~

四.依赖方式

简单介绍下常见的依赖方式：

1.dependencies 项目依赖

可使用npm install -S或 npm install --save保存到依赖中，当发布到npm上时dependencies下的模块会做为依赖，一块儿被下载!

2.devDependencies 开发依赖

可使用npm install -D或 npm install --save-dev保存到依赖中。
当发布到npm上时devDependencies下面的模块就不会自动下载了，若是只是单纯的开发项目dependencies，devDependencies只有提示的做用！

3.peerDependencies 同版本依赖

同等依赖，若是你安装我，那么你最好也安装我对应的依赖，若是未安装会报出警告

"peerDependencies": {
    "jquery": "2.2.0"
}

npm WARN youxuan@1.0.0 requires a peer of jquery@2.2.0 but none is installed. You must install peer dependencies yourself.

4.bundledDependencies 捆绑依赖

"bundleDependencies": [
    "jquery"
 ],

使用npm pack 打包tgz时会将捆绑依赖一同打包。

5.optionalDependencies 可选依赖

若是发现没法安装或没法找到，则不会影响npm的安装。

五.npm版本管理

npm采用了semver规范做为依赖版本管理方案。semver 约定一个包的版本号必须包含3个数字

MAJOR.MINOR.PATCH 意思是 主版本号.小版本号.修订版本号

• MAJOR 对应大的版本号迭代，作了不兼容旧版的修改时要更新 MAJOR 版本号
• MINOR 对应小版本迭代，发生兼容旧版API的修改或功能更新时，更新MINOR版本号
• PATCH 对应修订版本号，通常针对修复 BUG 的版本号

当咱们每次发布包的时候都须要升级版本号

npm version major  # 大版本号加 1，其他版本号归 0
npm version minor  # 小版本号加 1，修订号归 0
npm version patch  # 修订号加 1

若是使用git管理项目会自动 git tag 标注版本号

来看看版本号的标识含义:

range	含义	例
^2.2.1	指定的 MAJOR 版本号下, 全部更新的版本	匹配 2.2.3, 2.3.0; 不匹配 1.0.3, 3.0.1
~2.2.1	指定 MAJOR.MINOR 版本号下，全部更新的版本	匹配 2.2.3, 2.2.9 ; 不匹配 2.3.0, 2.4.5
>=2.1	版本号大于或等于 2.1.0	匹配 2.1.2, 3.1
<=2.2	版本号小于或等于 2.2	匹配 1.0.0, 2.2.1, 2.2.11
1.0.0 - 2.0.0	版本号从 1.0.0 (含) 到 2.0.0 (含)	匹配 1.0.0, 1.3.4, 2.0.0

预发版：

• alpha(α)：预览版，或者叫内部测试版；通常不向外部发布，会有不少bug；通常只有测试人员使用。
• beta(β)：测试版，或者叫公开测试版；这个阶段的版本会一直加入新的功能；在alpha版以后推出。
• rc(release candidate)：最终测试版本；可能成为最终产品的候选版本，若是未出现问题则可发布成为正式版本。

2.1.0-beta.1这样声明的版本用户不会立马使用，能够用来作测试使用。

六.scripts配置

在package.json中能够定义本身的脚本经过npm run来执行

"scripts": {
   "hello": "echo webyouxuan",
   "build": "webpack"
}

咱们可使用 npm run hello执行脚本，也可使用 npm run build执行node_modules/.bin目录下的webpack文件

• npm run 命令执行时，会把 ./node_modules/.bin/ 目录添加到执行环境的 PATH 变量中，所以若是某个命令行包未全局安装，而只安装在了当前项目的 node_modules的，经过 npm run 同样能够调用该命令。
• 执行 npm 脚本时要传入参数，须要在命令后加 -- 标明， 如 npm run hello -- --port 3000 能够将 --port 参数传给 hello 命令

• npm 提供了 pre 和 post 两种钩子机制，能够定义某个脚本先后的执行脚本，没有定义默认会忽略

  "scripts": {
     "prehello":"echo 关注",
     "hello": "echo webyouxuan",
     "posthello":"echo 谢谢~"
  }

能够经过打印 全局env和在项目下执行 npm run env来对比 PATH属性，不难发如今执行npm run 的时候确实会将 ./node_modules/.bin/ 目录添加到 PATH中

七.协议

不废话，这张图就说明了为何MIT许但是最大的了!

八.npx用法

npx命令是npm v5.2以后引入的新命令，npx能够帮咱们直接执行node_modules/.bin文件夹下的文件

1.执行脚本

npx webpack

是否是省略了配置scripts脚本啦！

2.避免安装全局模块

全局安装的模块会带来不少问题，例如：多个用户全局安装的模块版本不一样

npx create-react-app react-project

咱们能够直接使用 npx 来执行模块，它会先进行安装，安装执行后会将下载过的模块删除，这样能够一直使用最新版本啦!

九.包的发布

包的发布比较简单，首先咱们须要切换到官方源,这里推荐个好用的工具nrm

npm install nrm -g
nrm use npm # 切换到官方源

以后更新名字，这里也能够发布 做用域包 选定版本后，忽略文件夹可使用 .npmignore，一切就绪后，发布！！！

npm publish

ok，咱们的包就能够成功的发布到npm上啦！

十. 更多资料

参考

• 2018 年了，你仍是只会 npm install 吗？
• npm官网
• 如何选择开源许可证？

---