ホームページ >ウェブフロントエンド >jsチュートリアル >2 つの強力なノードパッケージマネージャー、npm とyarn について学習します。

2 つの強力なノードパッケージマネージャー、npm とyarn について学習します。

青灯夜游転載: 2022-08-25 11:00:081927ブラウズ

この記事では、Node.js の 2 つの強力なパッケージマネージャー、npm とyarn について説明します。

Node を学習する最初のステップは、node のパッケージマネージャー : npm を理解することです。 、誰もが npm に精通していると思います。なぜなら、いくつかのパッケージリソース

をダウンロードするためによく使用するからですが、npm のリソースライブラリ ( https://www.npmjs.com/) 海外では、リソースのダウンロードに使用する速度が比較的遅いため、yarntheseサードパーティnode パッケージ##そして、npm ウェアハウスと同期して更新される国内 タオバオミラー (cnpm)

次に、これらの内容を詳しく調べてみましょう。始めましょう！

Nodeシリーズコラムの更新を開始しました!ブロガーをフォローしてコラムを購読して、迷うことなくNodeを学びましょう!

1. npmの使用

npmとは

使用方法

npm の前に、Node シリーズコラム [Node.js | フロントエンドからフルスタックへの唯一の方法] の最初の記事で説明されている npm とは何かを理解する必要があります。 npm は Node のオープンソースウェアハウスであり、世界最大のオープンソースウェアハウスです。

このウェアハウスのアドレスは: https://www .npmjs.com/

2020 年 3 月 17 日の時点で、

npm は 130 万 パッケージを約 1,200 万 の開発者に提供しました。これらのソフトウェアパッケージは、毎月 750 億回ダウンロードされます。

npm ウェアハウス内のリソースをダウンロードして使用したい場合は、npmコマンド ( npm、npm i axios download axios など) または他のサードパーティの命令 (サードパーティの Node パッケージマネージャー) を使用します。

公式声明:

npm
は NodeJS## のパッケージ管理および配布ツールです。
# パッケージ管理
は、
NodeJS のさまざまなソフトウェアパッケージを保存および管理する NodeJS のウェアハウスであることを反映しています。
配布ツール
は、
npmコマンド
を使用してパッケージをnpmウェアハウスにダウンロードすることで反映されます。 今回の構成では
NodeJS
環境では、

npm コマンドモジュール

が NodeJS とともにインストールされます。インストールされているバージョンを表示するにはターミナル: ただし、デフォルトでインストールされている npm

バージョンが古すぎる場合は、

手動でインストールして実行することもできます。 update npm 2 つの強力なノードパッケージマネージャー、npm とyarn について学習します。 :

npm i npm@latest -g

@latest は最新バージョンのインストールを表し、-g

はグローバルインストールを表します。これらの

npm
の手順はこれについては後で説明します魔法のようなことが上にあります。npm から npm
までをインストールしています。自分でインストールしますか?

これは非常に理解しやすいです。npm のコマンドモジュール も npm ウェアハウスにパッケージとして保存されており、このパッケージの名前は

npm です

、npm を参照してください。アドレス: https://www.npmjs.com/package/npmつまり、 は通常 npm と呼ばれますnpm のコマンドモジュール (npm という名前のパッケージ)

2 つの強力なノードパッケージマネージャー、npm とyarn について学習します。

のみを指しますが、実際には、

npm という単語は npm コマンドモジュール ## を指します。

#npm

NodeJSオープンソースウェアハウス自体 も参照するため、npm にあります (この npm は NodeJS オープンソースウェアハウスを表します) ダウンロード npm (この npm は npm という名前のパッケージを表し、このパッケージは npm の命令モジュールです)
npm 共通命令

npm多くの命令があります。ここでは一般的に使用されるもののみを示します。詳細については、npm の公式ドキュメントを参照してください。

npm init:
package.json を生成

##npm install
:
ダウンロード
package.json に記録されているすべてのリソース
npm インストールパッケージ名 : 指定されたパッケージを現在のディレクトリにダウンロード
npm uninstall パッケージ名: Uninstallcurrent ディレクトリに指定されたパッケージ
npm update package name: Update現在のディレクトリ内の指定されたパッケージ。パッケージ名が追加されない場合、現在のディレクトリ内のすべてのパッケージが更新されます。 updated
npm 古いパッケージ名 : Check 現在のディレクトリにある指定されたパッケージ が古いかどうかを確認します (古い場合)パッケージ名を追加すると、現在のディレクトリ内のすべてのパッケージがチェックされます。
npm info パッケージ名：Getパッケージの詳細情報現在のディレクトリ
npm list: 現在のディレクトリにインストールされているすべてのパッケージとその依存関係を表示し、バージョン番号を表示します (list は ls と省略できます)
:
View 指定されたパッケージが現在のディレクトリにインストールされていますバージョン番号 (list は ls と省略できます)
Aいくつかの追加:

install

i
と省略できます。たとえば、次のようになります。 npm install axios npm i axios と省略できます。
uninstall
un
と省略できます。 #パッケージ名の後に
@ を追加します。
npm i md5@1
md5 のバージョン 1、npm をダウンロードします。 i md5@latest は、md5 の最新バージョンをダウンロードすることを意味します

コマンドサフィックス

: グローバル環境を指定しますnpm
デフォルトのコマンドは、現在のディレクトリに
-g
を追加し、 グローバル環境 操作で、上記のように npm の最新バージョンをグローバルにインストールします: npm i npm@latest -g なので、 npm## は任意のディレクトリで使用できます。
#--save
は
と省略できます。
: 本番環境で依存関係を指定します (dependency に記録されています) npm5 バージョン以降、デフォルトは次のとおりです。 --save
(本番環境と開発環境の両方にインストールされている場合) Axios が必要:
npm i axios -s
##--save-dev
は
-D
と省略できます:
開発環境 (devDependities に記録) で依存関係を指定します。 ) 運用環境にインストールされている場合、Babel を使用する必要はありません (開発環境でのみ使用されます): npm i babel -D

--save-prod
は
-P
と省略できます:
--save## と同じです#--save -optional は -O
オプションの依存関係を指定します
( optionalDependities に記録されます) --no-save:
package には記録されません。 json
-g、--save、--save-dev の特定の機能と違いについては、私の記事を参照してください。 npm install -g/–save/–save-dev

npm コマンドのサフィックスをパッケージ名の前に置くこともできます:

npm i -g npm @latest

依存関係パッケージ管理

npm

では、よく知られている依存関係は次のとおりです。 : dependency および devDependities

さらに、実際には次のとおりです: peerDependency,

optionalDependities

bundledDependities /bundleDependities
(いくつかの依存関係を含む) は、package.json

これらの種類の依存関係については、上記の

npm ディレクティブ接尾辞 について説明したときに説明しました。それらが何を表すかについて詳しく説明します:

2 つの強力なノードパッケージマネージャー、npm とyarn について学習します。 dependency

and

devDependities

私の他の記事「npm install -g/– の違い」をご覧ください。 save/–save-dev peerDependities

上司による記事「Understanding PeerDependities in one」を参照できます。記事

オプションの依存関係

## オプションの依存関係 (インストールが失敗した場合でも実行できる依存パッケージがいくつかある場合)または、npm を実行し続けたい場合は、

optionalDependency

を使用できます。optionalDependency は、dependency 内の同じ名前の依存関係パッケージを上書きするため、次のように書かないでください。

##bundledDependities / bundleDependities

依存関係のパッケージ化、

bundledDependency は、依存パッケージの名前を含む配列オブジェクト。公開するとき、このオブジェクト内のパッケージは次のようにパッケージ化されます。最終リリースパッケージでは、配列内のパッケージは最初に devDependency または dependency で宣言される必要があります。 、そうでない場合、パッケージはエラーを報告します

package.json中需要注意的包版本问题

通过npm下载的所有包的版本信息都会记录在package.json中

在运行npm i时就会根据package.json中记录的包信息进行下载，它的下载规则如下：

包版本以^开头时（默认情况），会锁定大版本
```
   // package.json
  "dependencies": {
    "md5": "^2.1.0" // ^开头的
  },
```
通过npm i将会安装md5 2.x.x的最新版本（2大版本下的最新版本），并不一定是2.1.0，还可能是2.3.0
包版本以~开头时，会锁定到第二个大版本
```
   // package.json
  "dependencies": {
    "md5": "~2.1.0"
  },
```
通过npm i将会安装md5 2.1.x的最新版本（2.1版本下的最新版本），并不一定是2.1.0，还可能是2.1.1
包版本为*，会锁定到最新版本
```
  // package.json
  "dependencies": {
    "md5": "*"
  },
```
通过npm i将会安装md5的最新版本
包版本前不带前缀，会锁定到指定版本
```
   // package.json
  "dependencies": {
    "md5": "2.1.0"
  },
```
通过npm i将会安装md5的2.1.0版本

解决npm速度慢的问题

因为npm仓库在国外，我们在国内使用npm指令下载这个国外仓库的内容速度会比较慢

这时我们就可以运行以下指令将npm的仓库源切换到国内的淘宝镜像（cnpm） 的源：

npm config set registry https://registry.npmmirror.com

使用npm config get registry查看当前源：

2 つの強力なノードパッケージマネージャー、npm とyarn について学習します。

往后再使用npm时就会自动从国内的淘宝镜像仓库下载了，速度就会很快

淘宝镜像之前的源地址为http://registry.npm.taobao.org，现在更改为了http://registry.npmmirror.com，查看详情

但我们这样通过修改npm的配置进行源的切换难免会有点麻烦，我们可以全局安装一个nrm来帮助我们快速的切换npm源

使用nrm快速切换npm源

全局安装nrm：

npm install -g nrm

执行nrm ls可查看可切换的npm源：

2 つの強力なノードパッケージマネージャー、npm とyarn について学習します。

使用npm use 切换源，如切换到淘宝源：nrm use taobao

2 つの強力なノードパッケージマネージャー、npm とyarn について学習します。

使用nrm test 源名测试相应源的响应时间：

2 つの強力なノードパッケージマネージャー、npm とyarn について学習します。

可以看到淘宝源的响应速度要比npm的默认源快很多

中国npm镜像：cnpm

cnpm是一个完整的npmjs.org镜像，可以用它代替官方版本

cnpm与官方版本的同步频率为10分钟一次，cnpm官网

下载cnpm：

 npm install -g cnpm --registry=https://registry.npmmirror.com

cnpm就是淘宝镜像，上面我们使用淘宝镜像源只是将npm的源更改为淘宝镜像（cnpm）的源（这个源其实就是指仓库的地址），之后还是通过npm指令进行使用

而这里是直接下载cnpm这个完整镜像，之后就可以使用cnpm指令而不是npm指令：

cnpm installcnpm i axios -g

// ....

cnpm的指令与npm的指令完全相同，使用时直接使用cnpm代替npm就行

二、yarn的使用

yarn是Facebook发布的一款依赖管理工具，它比npm更快、更高效

安装：

npm install -g yarn

更新yarn：

yarn set version latest
yarn set version from sources

优点

速度超快
yarn 缓存了每个下载过的包，所以再次使用时无需重复下载。同时利用并行下载以最大化资源利用率，因此安装速度更快
非常に安全です
コードを実行する前に、yarn はアルゴリズムを通じて各インストールパッケージの整合性を検証します

yarn の共通手順

##yarn init: プロジェクトを初期化し、 package を生成します。 json ファイルの生成手順は、npm init
とほぼ同じです。 : コマンドリストの表示
:
package.json に記録されているすべてのリソースをダウンロードします (yarn# と省略できます)。
##パッケージ名を追加します
指定された
パッケージを現在のディレクトリにダウンロードします ##yarn パッケージ名を削除
:
現在のディレクトリで指定されたパッケージ
yarn アップグレードパッケージ名
:
現在のディレクトリ内の指定されたパッケージ。パッケージ名の後に
@指定されたバージョン番号を追加して、更新するバージョンを指定できます##yarn コマンドサフィックス

##--dev: 開発環境

で依存関係を指定します。 (

)、-D--peer と省略: コアの依存関係を指定します (
)--optional: オプションの依存関係 (
)#を指定します結論この記事では、npm

yarn

、および nrm## の派生について紹介します。 npm #、cnpm

などから。

ブロガーは常に npm nrm スイッチングソース の組み合わせを使用してきました。これは、高速で便利なソース切り替えを保証するだけでなく、 cnpm、yarn などの追加のパッケージをダウンロードする必要はありません。

npm と yarn にはさらに多くの機能があります。コンテンツ。この記事では、最も一般的に使用されるコンテンツのみを説明します。さらに詳しく知りたい場合は、対応する公式 Web サイトにアクセスして、ノード関連の知識の詳細については、nodejs チュートリアルを参照してください。

以上が2 つの強力なノードパッケージマネージャー、npm とyarn について学習します。の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明：

この記事はcsdn.netで複製されています。侵害がある場合は、admin@php.cn までご連絡ください。

前の記事：5 つの一般的な JavaScript メモリエラー次の記事：5 つの一般的な JavaScript メモリエラー

続きを見る

2 つの強力なノード パッケージ マネージャー、npm とyarn について学習します。

1. npmの使用

二、yarn的使用

、および nrm## の派生について紹介します。 npm #、cnpm

関連記事

2 つの強力なノードパッケージマネージャー、npm とyarn について学習します。