yarn、npm、cnpm 都是包管理工具,各有优缺点。

npm

github: https://github.com/npm/cli
官网:https://www.npmjs.com/

node package manager,node 包管理工具

node 会自动安装 npm

# 初始化

# 生成 package.json
npm init -y 

在这里插入图片描述

# 配置

# 配置列表
npm config list
# 全局安装路径的前缀
npm config get prefix
# 局部安装路径前缀
npm root 
# 包安装的缓存路径
npm config get cache
# 获取安装包的仓库地址
npm config get registry

# 更改安装包的仓库地址
npm config set registry http://registry.npm.taobao.org/
# 国内,cnpm可能下载包比较快
# 使用cnpm代替npm
npm install cnpm -g --registry=http://registry.npm.taobao.org/

# 修改(全局)模块存放路径
npm config set prefix "E:\nodejs\node_global"
# 修改(全局)cache的路径
npm config set cache "E:\nodejs\node_cache"```
# 清理缓存
npm cache clean --force

# 安装依赖

# 下载依赖
# 会记录为 package.jsondev 的 dependencies
npm install jquery
npm i jquery
# 老版本需要 --save 才会把下载记录到 package.json 中
npm install jquery --save
# 下载开发环境依赖
# 会记录为 package.jsondev 的 Dependencies
npm install jquery --save-dev
npm install jquery -D
# 指定版本
npm install jquery@3.0.0
# 查看可用版本
npm view jquery versions 

# 更新
npm update jquery

# 卸载
npm uninstall jquery

安装的文件会存放再 node_medules 中

在这里插入图片描述

# package.json

name - 包名
version - 包版本号
description - 包描述
hompage - 包官网
author - 包作者
contributors - 包贡献者
dependencies - 包依赖列表
repository - 包代码存放的地方(git、svn)
main - 程序主入口(默认 index.js)
keywords - 关键字
package.json 和 package-lock.json

package-lock.json 通过命令行生成,自动被npm修改,不要自己修改。
锁定了具体版本,避免语义版本带来项目bug
当两个文件一致时,npm 根据 package-lock.json ,否则 根据 package.json 更新同步 package-lock.json

dependencies:^和~的区别

^1.11.1 表示 <2.0.0>=1.11.1
~1.11.1 表示 >1.11.x(x选取最大值)

scripts

package.json 中 scripts 可以作为脚本运行

{
....
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
....
}
PS C:\Users\lawsssscat\Downloads\obas> npm test

> obas@1.0.0 test
> echo "Error: no test specified" && exit 1

"Error: no test specified"
PS C:\Users\lawsssscat\Downloads\obas> npm run test

> obas@1.0.0 test
> echo "Error: no test specified" && exit 1

"Error: no test specified"

# 包的使用

  1. 手动定位
    没有webpack之前需要手动定位(node_modules中的某某某目录)

  2. commonjs 的 require 和 module 模块化

    const $ = require('jquery')
    
  3. es6 import

练习:ES6兼容性解决

比较通用的工具有 babel、jsx、traceur、es6-shim…

【todo】

yarn

官网:https://classic.yarnpkg.com/lang/en/

  • npm 的缺陷:

    1. npm install 下载速度慢,重新 install 时速度依旧慢
    2. 同一个项目,安装的无法保持一致性。原因是因为 package.json 文件中版本号的特点导致的,下面三个版本号在安装的时候代表不同的含义。
      "5.0.3"     # 表示安装指定的5.0.3版本
      "~5.0.3"    # 表示安装5.0.X中最新的版本
      "^5.0.3"    # 表示安装5.X.X中最新的版本
      
  • yarn 优点

    1. 速度快:(主要来自一下两个方面)
      1. 并行安装
        无论 npm 还是 yarn 在安装包的时候,都会执行一系列任务。 npm 是按照队列执行每个 package,所以 npm 是串行的。
        而 yarn 是并行的,它同步执行所有任务,性能得到了极大的提升。
      2. 离线模式
        如果使用 yarn 已经安装过一个软件包,再次安装时 yarn 会在之前的缓存中获取,而不会像 npm 再次从网络中下载。
    2. 安装版本统一
      1. 为了保持安装版本的统一性,yarn 有一个锁定文件(lock file)。它记录了被确切安装上的模块的版本号。每次只要新增一个模块,Yarn 就会更新 yarn.lock 这个文件。这么做保证了每一次拉取同一个项目依赖时,使用的都是一样的模块版本。
      2. npm 也有办法实现使用相同版本的 packages,但需要开发者执行 npm shrinkwrap 命令。这个命令将会生成一个锁定文件,在执行 npm install 的时候,该锁定文件会先被读取,和 Yarn 读取 yarn.lock 文件一个道理。
      3. npm 和 Yarn 两者的不同之处在于:Yarn 默认会生成这样的锁定文件,而 npm 要通过 shrinkwrap 命令生成 npm-shrinkwrap.json 文件,只有当这个文件存在的时候,packages 版本信息才会被记录和更新。

安装

npm install --global yarn

yarn 和 npm 命令对比

# 查看版本
yarn --version
npm -version(或者 node -v)
 

# 配置镜像
yarn config set registry 'https://registry.npm.taobao.org'     
npm install -g cnpm --registry=http://registry.npm.taobao.org
 
# 初始化某个项目
yarn init                                                  
npm init
 
# 默认安装项目依赖
yarn install                                            
cnpm install
 
# 安装依赖,并且默认保存到 package
yarn add xxx                                        
cnpm install xxx --save
 
# 安装全局项目依赖
yarn global add xxx                                
cnpm install xxx -g

# 卸载依赖
yarn remove xxx                                    
cnpm uninstall xxx --save
 
# 更新依赖
yarn upgrade xxx                                  
cnpm update xxx --save
 
# 安装特定版本号的项目依赖
yarn add xxx@                                       
cnpm install xxx@1.2.33 --save
 
# 发布/登录/登出,一系列NPM Registry操作
yarn publish/login/logout                         
npm publish/login/logout
 
# 运行命令
yarn run/test                                           
npm run/test
Logo

瓜分20万奖金 获得内推名额 丰厚实物奖励 易参与易上手

更多推荐