npmとcnpmを混在させる際の落とし穴の詳細な説明

npmとcnpmを混在させる際の落とし穴の詳細な説明

npm と cnpm を一緒に使用したときに奇妙な問題が発生したことはありませんか? Alipay ミニプログラムの cnpm インストール パッケージが無効であるという状況に遭遇したことはありませんか?本当にリクエスト元を切り替えるだけなのでしょうか?

多くの友人は単純な目的でcnpmを使用していると思います。つまり、ダウンロードを高速化するために、リクエストソースをhttps://registry.npm.taobao.orgに変更します。
そこで、私たちは

npm をインストール -g cnpm --registry=https://registry.npm.taobao.org

次に、npm の代わりに cnpm を使用します。これを行うと、上記の問題が発生しますが、しばらくは発見できない可能性があります。
(また、.npmrc を cnpm 内で実行している状況もあります。この場合、cnpm を使用しても非常に遅くなります。)

原因

npm を使用して何かをインストールしたところ、以前のものすべてに問題があることがわかりました。インストールしたばかりなのに、以前のものをどのように変更できるのかとパニックになりました。それで、この問題を注意深く調べてみたのですが、答えが見つからなかったので、偉い人に尋ねました。

理由

LinGoの返信

cnpm はデフォルトでソフト リンクを使用するため、インストール後に npm が以前の cnpm パッケージを更新し、以前の cnpm インポートが gg になるため、多くのものが gg になります。

すると、原因は cnpm 自体にあることがわかります。これを使用しなければ、問題は解決します。

最も簡単な方法は、npm install <いくつかのパラメータ> --registry=https://registry.npm.taobao.org を使用することです。

これは完璧ですが、非常に面倒でもあります。nrmでアップグレードできます

NPM の紹介:

説明: NPM (Node Package Manager) は、Node プラグインの管理 (インストール、アンインストール、依存関係管理などを含む) に使用される NodeJS のパッケージ マネージャーです。
NPM を使用してプラグインをインストールします。コマンド プロンプトで npm install <name> [-g] [--save-dev] を実行します。
<name>: ノードプラグイン名。
例: npm install gulp-less --save-dev
-g: グローバルにインストールします。 C:\Users\Administrator\AppData\Roaming\npm にインストールされ、システム環境変数に書き込まれます。非グローバル インストール: 現在の場所のディレクトリにインストールされます。グローバル インストールはコマンド ラインのどこからでも呼び出すことができますが、ローカル インストールは、require() によって呼び出され、場所のディレクトリの node_modules フォルダーにインストールされます。
--save: package.json に保存します (package.json は NodeJS プロジェクト構成ファイルです)
-dev;: package.json の devDependencies ノードに保存します。-dev が指定されていない場合は、dependency ノードに保存されます。なぜ package.json に保存するのでしょうか?ノードプラグインのパッケージは比較的大きいため、バージョン管理には含まれません。構成情報は package.json に書き込まれ、バージョン管理に追加されます。他の開発者はそれに応じてダウンロードできます (コマンドプロンプトで npm install を実行し、package.json に従って必要なパッケージをすべてダウンロードします)。

6. npmを使用してプラグインをアンインストールします: npm uninstall <name> [ -g ] [ --save-dev ]

7. npmを使用してプラグインを更新します: npm update <name> [ -g ] [ --save-dev ]

8. すべてのプラグインを更新します: npm update [ --save-dev ]

9. NPMヘルプを表示: NPMヘルプ

10. 現在のディレクトリにインストールされているプラ​​グインを確認します: npm list

CNPM の紹介:

注意:Googleインストールプラグインは海外のサーバーからダウンロードされるため、ネットワークの影響を大きく受け、異常が発生する可能性があります。Googleのサーバーが中国にあったら問題ないので、喜んで共有する私たちのTaobaoチームがこれを行いました。公式サイトから:「これは完全なnpmjs.orgミラーです。公式バージョン(読み取り専用)の代わりにこれを使用できます。同期頻度は現在10分に1回で、公式サービスとの同期を可能な限り確保しています。」
公式サイト: http://npm.taobao.org
インストール: コマンドプロンプトでnpm install cnpm -g --registry=https://registry.npm.taobao.org
実行します。 npm install cnpm -g --registry=https://registry.npm.taobao.org
注: インストール後は、cnpm -v でバージョンを確認するか、コマンド プロンプトを閉じて再度開くことをお勧めします。インストール後に直接使用すると、エラーが発生する可能性があります。注: CNPM は、コマンド実行時に Google が CNPM に置き換えられることを除いて、使用方法は NPM とまったく同じです。

より良い方法

npm インストール -g nrm
nrmはcnpmを使用する

その後、npm を使用して簡単にダウンロードできます。
ナーム

-- 物語はまだ終わらない --

このとき、プロジェクトですでに cnpm が使用されている場合はどうすればよいでしょうか?

方法の改善

cnpm i --by=npm

これで、cnpmとnpmは競合しなくなります。たとえば、cnpm i --by=npm react

理由

cnpm はデフォルトで npminstall を使用します。node_modules のシンボリックリンク モードが気に入らない場合は、インストーラーをオリジナルの npm に変更できます。ただし、最速のインストール速度は失われます。

cnpmポータル

npm と cnpm の混在の落とし穴に関する記事はこれで終わりです。npm と cnpm の混在についてさらに詳しく知りたい方は、123WORDPRESS.COM の過去の記事を検索するか、以下の関連記事を引き続きご覧ください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。

以下もご興味があるかもしれません:
  • npm と cnpm のインストール手順を実装する Windows
  • cnpm が内部コマンドにならない場合の解決策: 環境変数を構成する [推奨]
  • node npm cnpmの具体的な使い方を簡単に理解する
  • npm cnpm npx nvm を区別する方法
  • Mac に nodejs、npm、cnpm をインストールするチュートリアル

<<:  MySQL の自己結合重複排除に関する注意事項

>>:  nginx と keepalived を組み合わせて高可用性を実現するための手順を完了する

推薦する

JSフロントエンドモジュール化のいくつかの仕様についての簡単な説明

目次序文フロントエンドモジュール開発の価値厄介な名前の競合面倒なファイル依存関係モジュール化の利点C...

Docker で SVN サーバーを構築するチュートリアル

SVN は Subversion の略称で、ブランチ管理システムを使用して効率的に管理するオープンソ...

Vueは新しいウィンドウを開き、パラメータ転送のグラフィック例を実装します。

私が実現したい機能は、新しいウィンドウを開いて新しいページを表示することですが、パラメータを渡す必要...

MySQL 最適化の概要 - クエリエントリの合計数

1. COUNT(*) と COUNT(COL) COUNT(*)は通常、主キーに対してインデックス...

Linux システムによって報告される tcp_mark_head_lost エラーの処理方法

問題の説明最近、ホストから次のカーネル情報が報告されました。 7月8日 10:47:42 cztes...

docker CMD/ENTRYPOINT が sh スクリプトを実行する問題の解決策: not found/run.sh:

Dockerfile の設定に問題はありませんが、ENTRYPOINT コマンドを実行するとエラー...

Alibaba Cloud OSS によってアップロードされた Nginx プロキシ転送実装コード

序文ミニプログラムのアップロードには https が必要なので、サーバーの https は lets...

Reactのコンテキストとプロパティの説明

目次1. 文脈1. 使用シナリオ2. 使用手順3. 結論2. 小道具の詳細1. 子供の財産2. 小道...

ウェブページのテーブルの境界線を設定する方法

<br />前回は、Web テーブルにセルの線を設定する方法を学びました。今日は、Web...

効率をN倍に高めるVimクイックリファレンステーブル15個

昨年の前半から開発と娯楽のために Linux を使い始めましたが、今では Windows には戻れま...

検証例 MySQL | 同じ値を持つフィールドを更新すると、binlog に記録されます

1. はじめに数日前、開発仲間から、フィールドを同じ値に更新すると binlog が記録されるかどう...

React でカレンダー コンポーネントを構築するためのステップ バイ ステップ ガイド

目次事業背景テクノロジーの活用技術的な問題デザインのアイデア😱 困惑と苦痛に満ちた顔🙄考え始める🌲デ...

あまり多くのコードを書かずに、ハイパーリンクを使ってシンプルで美しいカスタムチェックボックスを実装できます。

今日ふと、HTML でチェックボックスのスタイルを変更できる範囲が限られていることと、チェックボック...

ウェブページヘッダーの最適化の提案

ロゴの最適化: 1.ロゴ画像はできるだけ小さくしてください。 2. 一般的には背景として配置されます...

nginx と openssl で https を実装する方法

サーバーデータがSSL証明書を使用して暗号化および認証されていない場合、ユーザーのデータはプレーンテ...