【転載】nodejs と npm と yarn

title: 【転載】nodejs と npm と yarn
date: 2022-06-06 11:09:00
toc: false
index_img: https://puep.qpic.cn/coral/Q3auHgzwzM4fgQ41VTF2rILyI8ckeUFuZTtuo8Y2TUQ8JpxuBcS3aQ/0
category:

フロントエンド
tags:
yarn
nodejs
npm
global
add
remove
dir
config
list
registry

原文：nodejs と npm と yarn - 掘金，本站仅作保存记录及调整排版，不做盈利性质的商业行为。

1. nodejs とは何か#

Node.js は、サーバーサイドで JavaScript を実行できるオープンソースのクロスプラットフォーム JavaScript 実行環境です。Node.js のほとんどの基本モジュールは JavaScript 言語で書かれています。Node.js が登場する前は、JavaScript は通常クライアントプログラムの設計言語として使用され、JavaScript で書かれたプログラムはユーザーのブラウザ上で実行されていました。簡単に言えば、Node.js はサーバーサイドで実行できる JavaScript です。

つまり、簡単に言えば node.js はサーバーサイド JavaScript の IDE（統合開発環境）であり、略して Node 環境です。

2. npm とは何か#

npm（正式名称 Node Package Manager、つまり「node パッケージマネージャー」）は、Node.js のデフォルトであり、JavaScript で書かれたソフトウェアパッケージ管理システムです。

npm の誕生と発展については、方方先生の回答をお勧めします。こちらをご覧ください npm は何をするものですか？（非チュートリアル）

どの言語にも独自のパッケージ管理ツールがありますが、npm は JavaScript 言語のパッケージ管理ツールです。サーバーサイド JavaScript は通常 NPM を依存関係管理ツールとして使用します。npm は node.js パッケージの管理を意味しますが、両者は協力関係にあり、npm は node.js に依存して人気を得ました。しかし、最終的には JavaScript 言語のパッケージ管理ツールであり、フロントエンド開発は主に JavaScript 言語を使用するため、フロントエンド開発を行う際には他の人が書いた多くの JavaScript コードパッケージ（jQuery.js、vue.js など）を使用することになります。したがって、npm はフロントエンド開発を学ぶ上で理解し、習得しなければならない優れた js パッケージ管理ツールとなります。

3. node のインストール#

node.js をバックエンド開発に使用しない、フロントエンド開発だけを行うので、npm だけをインストールすればいいのではないかと思う人もいるかもしれません。

可能ですが、node.js と npm は協力関係にあり、どちらも欠かせません。npm は node.js に同梱されており、node.js をインストールすると自動的に npm も含まれます。また、node.js は現在非常に人気があるため、フロントエンドの分野に入る場合、いつか node.js を使用することになるでしょう。したがって、npm を使用するために node.js をインストールすることをお勧めします！

公式サイトから単一バージョンをダウンロードしてインストール#

Node.js 公式サイト

できるだけ偶数バージョンを選択してください。Node8、Node10、Node12 など、偶数バージョンは安定版です。.msi インストールファイルを選択し、x64 は 64 ビットシステム、x86 は 32 ビットシステムです。インストール手順は以下の通りです：

ダウンロードが完了したら、直接インストールをクリックします。インストールディレクトリを変更することをお勧めします。node.js のインストールパスには空白を含めることができません。オプション選択で全てにチェックを入れる必要があります。特に path に追加するオプションですが、デフォルトでは全選択になっていますので、直接次へ進んでください。インストールが完了したら、コマンド node --version を実行して現在のバージョンを確認します。成功すれば問題ありません。成功しない場合は、環境変数が正しく設定されているか確認してください。

NVM バージョン管理ツールを使用#

公式サイトから node.js をダウンロードしてインストールする以外にも、NVM ツールを使用して node.js のバージョンを切り替えることができます。最近、node.js をアップグレードする必要があり、ネットで推奨されている n モジュール 管理ツールを使用しましたが、あまり役に立ちませんでした。どうやら windows をサポートしていないようです。NVM 管理ツールを使用したところ、非常に便利でした。

NVM は node.js のバージョン管理ツールで、node.js のインストールとバージョン切り替え機能を提供します。

1. NVM のインストール#

Windows 版のダウンロードリンク：nvm-windows

中に入って nvm-setup.zip を見つけ、ダウンロード後に .exe のインストーラーを得ます。インストール中に二つのディレクトリ選択が表示されます。最初は nvm ツールのインストールパス、二つ目は現在使用する node.js のバージョンのパスです。自分で設定できます。以下のように：

最初のディレクトリ選択

二つ目のディレクトリ選択

NVM のインストールが完了したら、nvm --version を実行してバージョン番号とコマンド情報が表示されれば、インストール成功です。

2. NVM のダウンロードソースを切り替える#

nvm をインストールした後、すぐに node.js をダウンロードしないでください。なぜなら、node.js と npm のデフォルトダウンロードソースは海外で、非常に遅いからです。まず、nvm のデフォルトダウンロードソースを変更する必要があります。以下のコマンドを実行します：

nvm node_mirror https://npm.taobao.org/mirrors/node/
nvm npm_mirror https://npm.taobao.org/mirrors/npm/

3. nvm の使用を開始#

node.js のインストールを開始します。コマンド nvm install <version> [arch] を使用します。ここで、version はバージョン番号、arch はオプションのパラメータで、オペレーティングシステムのビット数を指します。デフォルトは 64 ビットです。32 ビットのオペレーティングシステムの場合、arch は 32 です。これらのコマンドは nvm --version で表示される説明を参照できます。

nvm install latest             //最新の node をインストール
nvm install バージョン番号      //64ビットオペレーティングシステム
nvm list                       //現在インストールされているすべての node バージョンを表示
nvm use バージョン番号          //バージョン切り替え

どのバージョン番号がインストール可能か分からない場合は、こちらを見てください nodejs-realease

4. npm の使用#

デフォルトダウンロードソースの変更#

node.js をインストールした後、コマンドラインで以下のコマンドを入力して、npm が自動的に含まれているか確認します。

npm を使用してさまざまなツールパッケージをインストールまたはダウンロードするのを急がないでください。なぜなら、npm のデフォルトダウンロードソースは海外にあり、ダウンロード速度が非常に遅いためです。npm のダウンロードソースを淘宝に設定する必要があります。ここで npm のダウンロードソース管理ツール nrm を使用します。

npm で nrm をインストールし、以下のコマンドを実行します
npm i -g nrm // 最初は海外から nrm をダウンロードする必要があり、少し遅いので待ちます
ダウンロードが完了したら、nrm --version を実行してバージョン番号が表示されればインストール成功です
nrm ls を実行すると、現在使用可能なダウンロードソースが表示されます。星印 * が付いているのが現在使用中のもので、デフォルトは npm です
nrm use taobao を実行して淘宝ダウンロードソースを選択します。

npm インストールコマンド#

グローバルインストール：

npm i -g パッケージ名

または

npm install -g パッケージ名

PS: i は install の略、g は global の略です

グローバルアンインストール：

npm uninstall -g パッケージ名

npm でグローバルにインストールしたパッケージはどこにありますか？

C:\Users\Administrator\AppData\Roaming\npm\

必ずしも同じではありませんが、which 使用npm全局安装的包名 を使用して位置を確認できます。例：

また、以下のコマンドを使用して、node_modules 内で確認できます

npm config get prefix

5. yarn のインストール#

yarn のインストール#

yarn は新しい JavaScript 言語のパッケージ管理ツールで、npm の代わりに使用できます。npm よりも高速で安定して使いやすいです。インストール方法は以下の通りです：

Yarn 公式サイト

このサイトではバージョンを選択する必要はありません。コンピュータのバージョンに基づいて推奨されたバージョンが表示されるので、直接インストールプログラム .msi ファイルをクリックしてダウンロードします。直接インストールし、できればパスを変更してください。パスに空白が含まれないようにしてください。

yarn をインストールした後、yarn --version を実行してインストールが成功したか確認します。

yarn もデフォルトで海外からダウンロードされますが、npm をすでにインストールし、npm のデフォルトダウンロードソースを設定しているため、yarn は自動的に npm の存在を検出し、npm と同じダウンロードソースを自動的に設定します。

yarn config list で yarn に関連する設定とダウンロードソース registry を確認します。

yarn config get registry で現在のダウンロードソースを確認します。

もし npm と同じでない場合は、yarn に対応するソース管理ツールをインストールして設定する必要があります。npm の nrm の使い方と同じで、yarn に対応するのは yrm です。

yarn global add yrm

その後、yrm use taobao を実行します。

yarn コマンド#

1. グローバルインストール#

yarn global add パッケージ名

2. グローバルアンインストール#

yarn global remove パッケージ名

3. グローバルインストールディレクトリの確認#

yarn global dir