npm的介绍说明

---

一、什么是npm

npm(全称Node Package Manager,即 node 包管理器)
是Node.js默认的、以JavaScript编写的软件包管理系统
npm来分享和使用代码已经成了前端的标配

官网： npm

拥有超过一百万个软件包，是世界上最大的软件注册表
安装完毕node后，会默认安装好npm
npm本身也是基于Node.js 开发的软件

下载：http://Node:http://nodejs.cn

因为npm默认是国外地址下载，所以会很慢，这时候就要学会npm的镜像设置与查看，转化为国内官网下载，具体步骤如下：

• 搭建环境时通过如”下代码将npm设置成淘宝镜像
  npm config set registry htps://registry.npm.taobao.org --global
  npm config set disturl hts://pm.taobao.org/dist – global

• 设置当前地址(设置为默认地址)
  npm config set registry https://registry.npmjs.org/

• 查看镜像的配置结果
  npm config get registry
  npm config get disturl

• 你可以使用淘宝定制的cnpm (gzip压缩支持)命令行工具代替默认的npn
  $ npm install -g cnpm -gistry-tts://registry.npm.taobao.org

• 使用nrm工具切换淘宝源
  npx nrm use taobao

• 如果之后需要切换回官方源可使用
  npx nrm use npm

npm的基本使用：

npm V通过查 版本，看npm是否安装成功

**npm install < Module Name>**使用 npm命令安装模块

npm install < Module Name> -9可以直接在命令行里使用

npm list g查看所有全局安装的模块

npm list vue查看某个模块的版本号

npm -9 install npm@5.9.1 (@后跟版本号) 这样我们就可以更新npm版本

npm install -save moduleName #. save 在package文件的dependencies节点写入依赖。

npm install -save -dev moduleName # -save -dev在package文件的devDependencies节点写入依赖

**dependencies:**运行时的依赖，发布后，即生产环境下还需要用的模块
**devDependencies:**开发时的依赖。里面的模块是开发时用的，发布时用不到它比如项目中使用的gulp.压缩css.js的模块。这些模块在我们的项目部署后是不需要的

更新：npm update jquery

卸载：npm uninstall jquery

npm的一些常见属性：

1. name -包名。
2. version -包的版本号。
3. homepage -包的官网url。
4. author -包的作者姓名。
5. contributors .包的其他贡献者姓名。
6. dependencies -依赖包列表。如果依赖包没有安装，npm 会自动将依赖包安装在node. module目录下。
7. repository -包代码存放的地方的类型，可以是git或svn, git 可在Github上
8. main . main字段指定了程序的主入口文件,
   requre’moduleName’)就会加载这个文件。这个字段的默认值是模块根目录下面的indexjs.
9. keywords -关键字

package, json文件中版本号的说明，安装的时候代表不同的含义:

• *5.0.3”表示安装指定的5.0.3版本
• *~5.0.3"表示安装5.0.X中最新的版本
• description -包的描述。
• *^5.0.3"表示安装5.XX中最新的版本

npm常用命令：

① NPM提供了很多命令，例install和publish, 使用npm help可查看所有命令
② 使用npm help 可查看某条命令的详细帮助，例如npm help install
③ 在package. json所在目录下使用npm install . -g可先在本地安装当前命令行程序，可用于 发布前的本地测试
④ 使用npm update 可以把当前目录下node_ modules子目录里边的对应模块更新至最新版本
⑤ 使用npm update -g可以把全局安装的对应命令行程序更新至最新版
⑥ 使用npm cache clear可以清空NPM本地缓存,用于对付使用相同版本号发布新版本代码的人
⑦ 使用npm unpublish @ 可以撤销发布自己发布过的某个版本代码

包的使用：

通过命令行使用npm下载和更新包
没有webpack之前搜寻整个node_ modules目录来定位每个包的路径再手动添加到我们HTML文件中(实在太太不方便了)
大多数编程语言都会提供从一个文件导入另一个文件代码的机制。然而JavaScript最初设计时并没有这个特性，因为JavaScript原本是为了在浏览器端运行而设计的，并没有权限获取计算机客户端的文件系统(安全考虑)。所以很长一段时间以来,组织多个文件的JavaScript代码就是把每个文件下载下来，变量是全局共享的。CommonJS中很大的一部分便是对模块系统的规范

• 使用require语句导入包
• 新的ES6可以使用import导入包
• 通过ES6安装包来解决兼容性问题：

实验步骤如下:

1. 使用NPM全局安装babel-cli包。(babel _V)
2. 找一个目录，用npm来初始化一个项目，用来搭建我们的babel环境。(npminit) 或(npm init -y)
   babel提供的一-个编译工具babel-node，也可执行我们的js代码(babel-node index.js)
3. 在项目目录下新建.babelrc文件(这是babel的配置文件)
   “presets”: ["*es2015", “stage-2”],//设置转码规则
   “plugins”: [“transform-runtime”] //设置插件
   这里我们需要转换成es2015，安装我们需要的库: npm install babel-core babel-preset-es2015
   babel-plugin-transform-runtime babel-preset-stage-2 - save-dev
   4.我们再打开我们babel项目下的package.json文件，做如下修改 “scripts”: { “build”: "babel src
   -W -d lib”}, 编译整个src目录并将其输出到lib目录。这里的src指的是需要转换的目录，lib指的是输出的内容的存放目录，-w其实是-watch的意思，就是监听文件，实时编译输出 新建src目录和ib目录，记得一定要建，不然会报错
   5.然后我们启动我们的babel工程。 命令行输入npm run build.

---

二、npm的竞品yarn的安装和使用

“Yarn是由Facebook、 Google、 Exponent 和Tilde联合推出了一个新的JS包管理工具，正如官方文档中写的，Yarn 是为了弥补npm的一些缺陷而出现的。因为NPM5以下会出现下面的问题:
① npm install的时候巨慢。特别是新的项目拉下来要等半天，删除node_ modules,重新install的时候依旧如此
② 同一个项目，多人开发时，由于安装的版本不一致出现bug
官网: Home | Yarn - Package Manager

1.yarn的安装：

1. 下载node.js,使用npm安装
   npm install -g yarn

2. 查看版本: yarn --version

3. 安装node.js,"下载yarn的安装程序:
   提供一个.msi文件， 在运行时将引导您在Windows.上安装Yarn

4. Yarn淘宝源安装,分别复制粘贴以下代码行到黑窗口运行即可
   yarn config set registry https://registry.npm.taobao.org -9
   yarn config set sass_ binary_ site http://cdn.npm.taobao.org/dist/node-sass -g

2. yarn的基本使用：

• yarn init //初始化项目同npm init,执行输入信息后，会生成package json文件
• yarn install //安装package. json里所有包，并将包及它的所有依赖项保存进yrr.lock
• yarn install -at //安装一个包的单一版本
• yarn install -force //强制重新下载所有包
• yarn install -production //只安装dependencies里的包
• yarn install -no-lockile //不读取或生成yarn.lock
• yarn install --pure-lockfile //不生成yarn.lock
• yarn add lpackage] // 在当前的项目中添加一一个依赖包，会自动更新到package json和yam.lock文件中
• yarn add [package]@[version] // 安装指定版本，这里指的是主要版本,如果需要精确到小版本，使用-E参数
• yarn add Ipackagel@[tag] // 安装某个tag (此比如beta.next或者latest)
• yarn add --dev/-D //加到devDependencies
• yarn add --peer/P //加到peerDependencies
• yarn add --optional/-.O//加到optionalDependencies

yarn的优点：

👉 速度快

👉 安装版本统一

👉 更简洁的输出

👉 多注册来源处理

👉 更好的语义化

npm和yarn一些使用上的区别：

npm yarn
npm install yarn
npm install react --save yarn add react
npm uninstall react --save yarn remove react
npm install react --save-dev yarn add react --dev
npm update --save yarn upgrade

---

总结：

可以从npm迁移到yarn,也可以从yarn迁移到npm

有了yarn的压力之后，npm做了一些类似的改进,在npm5.0之前，yarn的优势特别明显。但是在npm之后，通过以上一系列对比，我们可以看到npm5在速度和使用上确实有了很大提升，值得尝试
如果你已经在个人项目上使用yarn,并且没有遇到更多问题，目前完全可以继续使用。但如果有兼容npm的场景，以及还没有切到yarn的项目,那现在就可以试一试npm5了