package.json ファイル
package.json ファイルは実際にはプロジェクトまたはモジュール パッケージの説明であり、多くのメタ情報が含まれています。たとえば、プロジェクト名、プロジェクトのバージョン、プロジェクト実行エントリ ファイル、プロジェクトの貢献者などです。
package.jsonのフィールドの意味
必須フィールド
パッケージには入力する必要があるフィールドがいくつかあり、npm init の実行時に入力されます。
◎ name: プロジェクト名、必須フィールド。
◎ バージョン: プロジェクトのバージョン。必須フィールドです。
◎メイン：エントリーファイル。
◎ライセンス：プロジェクトが準拠するライセンス。
◎スクリプト：実行可能なnpmコマンド。
◎キーワード：キーワード。
◎著者：著者。
◎ description: プロジェクトの説明。
必要な操作を簡素化するには、npm init -y を使用します。デフォルトは、yes です。
スクリプト構成
スクリプト構成は、起動プロジェクト、テスト スクリプトなどを構成できる実行可能なスクリプト コマンドです。これは、フロントエンド プロジェクトで不可欠かつ重要な構成の 1 つです。
"scripts": {
"dev": "node index.js",
"predev": "node preIndex.js",
"postdev": "node postIndex.js"
},
devDependency、依存関係の構成
依存関係パッケージ: npm パッケージ宣言が依存関係または devDependency に追加されます。
依存関係で宣言されるのは、運用環境のプロジェクトに必要なパッケージです。npm install xxx --save または npm install xxx
devDependencyを実行して、開発を支援するために Webpack、ESLint、Babel などの開発フェーズ中に必要なパッケージを宣言します。これらのパッケージは、パッケージ化してオンラインにするときに必要ないため、パッケージの実際の使用法に応じて適切な場所に宣言する必要があります。npm install xxx --save-dev または npm install xxx -D を実行します。
バベル構成
ES6～7のコード変換などはプロジェクト内で設定できます。ほとんどがBabelコンパイルの設定です。
"babdel" : {
"presets": ['@babel/preset-env'],
"plugins": [...]
}
インストールされている依存関係のバージョンがすべて 3 桁なのはなぜですか?これはどういう意味ですか?
バージョン指定は。です
XYZ1.0.0 はハードコードされたバージョンを表し、このバージョンは npm install 時に必ずインストールされます^1.0.0 は、現在のパッケージに新しいバージョンがある場合にそれを表します。は 1.1.1 にアップグレードされ、npm install 時にバージョン 1.1.1 に自動的にインストールされます。~1.0.0 は ^1.0.0 に似ています。違いは、^1.0.0 は X が変更されないことを意味し、 YZ は最新バージョンで変更されます。~1.0.0 は X と Y が変更されないことを意味し、Z は最新バージョンを保存します
npm installの原理
package-lock.json ファイル
npm install を再実行するとき、または、node_modules フォルダーが存在しないか削除されたときに、npm install を使用してすべての依存関係を再ロードする必要がある場合は、package-lock.json を通じてダウンロード アドレスと関連する依存関係を直接指定できます。パッケージからダウンロードします。.json はパッケージの依存関係を 1 つずつ分析するため、インストールが大幅に高速化されます。package -lock.json の目的は、すべてのライブラリ パッケージがそれらのパッケージとまったく同じであることを確認することです。前回インストールしました。
package-lock.json のライブラリ パッケージをアップグレードする場合は、
npm install XXX@xxx
npmとyarnの違い
共通点:yarn と npm はどちらもパッケージ管理ツールであり、yarn は npm の最適化されたバージョンであると言えます。
違い:
yarn は並列インストール (サーバー速度が速いため、ダウンロード速度が速い) をサポートし、複数のタスクを同時に実行できますが、npm は次のタスクを実行する前に前のタスクがインストールされるまで待つ必要があり、yarn はオフライン モードをサポートします。インストール
(既にパッケージがインストールされている場合)、yarn を使用して再インストールすると、キャッシュからパッケージが取得され、npm がネットワークからダウンロードされます。yarn はバージョン
ロックをサポートし、yarn でパッケージをインストールすると、yarn.lock ファイルが作成されます。統合環境を確保するためにデフォルトでバージョンをロックしますが、npm はデフォルトでネットワークからダウンロードします。最新かつ最も安定したものをダウンロードします。(注: npm はコマンドを通じてバージョン ロックを実装できます。バージョン ロックは、パッケージ間のバージョンの非互換性の問題を解決できます。つまり、npm install --save パッケージ名@バージョン番号) パッケージのインストール時に、yarn が出力する情報は少なくなり、npm は詳細な情報を出力します
。 . 残ります。
npmとcnpmの違い
(1) 2 つの唯一の違いは、ノード内のパッケージ マネージャーです。
(2) npm は、node の公式パッケージ マネージャーです。cnpm は、npm の中国語版で、デフォルトの npm を置き換える、淘宝網でカスタマイズされた cnpm (gzip 圧縮サポート) コマンド ライン ツールです。
(3) ネットワークの理由で npm を使用してダウンロードできない場合は、cnpm が便利です。
npm と cnpm はダウンロード アドレスが異なるだけであることに注意してください。npm は海外からダウンロードし、cnpm は中国からダウンロードします。
npxの使用
例:
my-package というパッケージがあり、それを実行したいとします。
npx を使用しない場合、パッケージを実行するには、次のようにローカル パス経由でパッケージを実行する必要があります。
./node_modules/bin/my-package
または、次のように package.json ファイルの script セクションで別のスクリプトとして定義します。
{
"name":"something",
"version": "1.0.0",
"scripts": {
"my-package":"./node_modules/bin/my-package"
}
}
次に、npm run my-package を使用して実行します。
npx を使用すると、npx my-package を実行するだけでこれを簡単に行うことができます。
例 2:
ノードモジュールにインストールされているパッケージは、グローバルにもインストールされています。現在のディレクトリで xxx --version を実行すると、グローバル バージョンが見つかります。現在のノードモジュールのバージョンを取得するには、npx xxx --version. get を実行します。
pnpmの使用
以前の状況: コンピューター上に十数のプロジェクトがありますが、以前のパッケージ管理ツールはどれも問題を解決できません。つまり、これらの十数のプロジェクトがすべて Vue である場合、それらはすべて Vue パッケージを参照し、独立して存在します。これにより、コンピュータのメモリが過大になります。
最大の利点: 高速でディスク容量を節約できるパッケージ管理ツール。
pnpm は正確に何をしますか?
1. npm または Yarn を使用する場合、100 個のプロジェクトがあり、すべてのプロジェクトに同じ依存関係パッケージがある場合、同じ依存関係パッケージの 100 個のコピーをハード ディスクに保存する必要があります。
2. pnpm を使用する場合、依存パッケージは統一された場所に保存されるため、同じ依存パッケージに同じバージョンを使用する場合、ディスク
上には依存パッケージのファイルが 1 つだけ存在します。
同じ依存パッケージ 異なるバージョンを使用する場合、バージョン間で異なるファイルのみが保存されます。
すべてのファイルはハード ディスク上の統一された場所に保存されます。
ソフトウェア パッケージがインストールされると、それに含まれるすべてのファイルがハード リンクされます。この場所では、余分なハード ドライブ領域が占有されます。
これにより、プロジェクト間で同じバージョンの依存関係パッケージを簡単に共有できるようになります。
ソフト接続とハード接続の概念
ソフト リンクは、ショートカットなどの参照の一種です。このショートカットはパスを保存します。元のファイルが削除されると、そのファイルを指すシンボリック リンクはすべて破棄されます。ハード リンクは、実際にデータを指すユニットです
。移動した場合、または元のファイルが削除された場合、ハード リンクはファイル構造内のファイルの場所ではなくファイルの物理データを参照するため、破壊されません。
pnpmの原理
pnpm を使用している場合、依存パッケージはハード ディスク上の統一された場所に保存されます。
ソフトウェア パッケージがインストールされると、そこに含まれるすべてのファイルが、追加のハード ドライブ領域を占有することなく、この場所にハードリンクされます。これにより、プロジェクト間で同じバージョンの依存パッケージを簡単に共有できます。ソフト リンクも確立されます。 . ノードモジュールへ
pnpm は非フラット化ノード モジュールを作成します
■npm または Yarn を使用して依存関係パッケージをインストールする場合、すべてのソフトウェア パッケージはフラット化された node_modules のルート ディレクトリにプロモートされます。その結果、ソース コードは現在のプロジェクトによって設定されていない依存関係パッケージにアクセスできます
。
非フラット ノード 上に示したモジュール。冗長な依存関係パッケージは表示されません。
npmと同等のコマンド
pnpm の欠点は、時間が変化し、プロジェクトの数が増加するにつれて、pnpm ストア フォルダーがますます大きくなることです。