npmのインストールチュートリアル
第 1 章 Vue 学習の開始 - Node.js の使用方法
序文
時代の発展に伴い、フロントエンド学習の技術はますます重要になってきており、多くの人がフロントエンド学習を始めていますが、この記事ではフロントエンド学習-npmのインストールの基本的な内容を紹介します。
1.npmとは何ですか?
npmは NodeJS のパッケージ マネージャーであり、vue-cli スキャフォールディング テンプレートは npm に基づいてノードにインストールされます。
関連紹介 ~
webpack: その主な目的は、リソースのマージやパッケージ化など、CommonJS 構文を通じてブラウザー側で公開する必要があるすべての静的リソースを準備することです。
vue-cli: Vue プロジェクト テンプレートを迅速に生成するために公式に提供されるスキャフォールディング。
2. 環境変数をインストールして構成する
1.NodeJSをダウンロードしてインストールします
Windows での NodeJS のインストールは比較的便利です (バージョン v0.6.0 以降、Windows ネイティブがサポートされています)。公式 Web サイト ( https://nodejs.cn/download/ ) に直接アクセスするだけです。ここで Windows インストール パッケージを選択できます。 (.msi) - 64 ビットをインストールします。
または、公式 Web サイトhttp://nodejs.org/に直接ログインします。
- インストールプロセスは基本的に「完了」まで「 NEXT 」だけです。
Windows では、パス システム変数は、msi ファイルのインストール中に直接追加されます。変数値は、「D:\RunSoftware\nodejs」などのインストール パスです。
- Nodejs のインストールが成功したことを確認します:
ショートカット キー win+R —> cmd コマンド ラインを入力し、DOS ウィンドウに入ります: Enter を押してnode -v
、バージョン番号が正しく出力されるかどうかを確認します。
ノードには npm が付属しています。それを入力してnpm -v
、バージョン番号が正しく出力されるかどうかを確認してください。
2.npm設定
npm は NodeJS モジュール管理であり、まずnpm のグローバル モジュールのストレージ パスとキャッシュ パスを設定します。
(1) 2 つのディレクトリnode_cacheとnode_globalを作成します。
これら 2 つのフォルダーを NodeJS のメイン ディレクトリに配置する場合は、NodeJs の下に「node_global」と「node_cache」の 2 つのフォルダーを作成します。
(2)設定を行う
npm config set prefix "D:\RunSoftware\nodejs\node_global"
npm config set cache "D:\RunSoftware\nodejs\node_cache"
このステップを設定しない場合、npm のグローバル インストール パッケージはノードのインストール フォルダーに存在しません。
この手順でエラーが発生した場合 (操作は許可されていません、mkdir 'D:\RunSoftware\nodejs')、管理者として cmd コマンド ラインを開いてください。(3)環境変数
の設定. 環境変数ダイアログ ボックスに入り、システム変数の下に新しい「NODE_PATH 」を作成し、「D:\RunSoftware\nodejs\node_global\node_modules」と入力します。
モジュールのデフォルトのアドレスが変更されているため、上記のユーザー変数もそれに応じて変更する必要があります (ユーザー変数「PATH」は「D:\RunSoftware\nodejs\node_global\」に変更されます)。そうしないと、モジュールを使用するときに入力コマンドを実行すると、「xxx は内部コマンドまたは外部コマンド、操作可能なプログラムまたはバッチ ファイルとして認識されません」エラーが発生します。
(4) Node.js 淘宝画像アクセラレータ (cnpm) をインストールします。この場合、ダウンロードははるかに速くなります~
-
ミラーサイトを設定します。
npm config set registry=https://registry.npm.taobao.org
-
ミラー サイトが利用可能かどうかを確認します。
npm config get registry
-
次に、次のコマンドを入力します。
npm install -g cnpm --registry=https://registry.npm.taobao.org
または、次のコマンドを入力します。
# -g 就是全局安装
npm install cnpm -g
# 或使用如下语句解决 npm 速度慢的问题
npm install --registry=https://registry.npm.taobao.org
- システム変数 pathの内容を追加します。
cnpm は D:\RunSoftware\nodejs\node_global にインストールされ、システム変数 path にはこのパスが含まれないためです。したがって、システム変数pathの下にパスを追加すると、通常どおり cnpm を使用できるようになります。
- 次に、コマンドを入力して
cnpm -v
、結果を表示します。
インストールプロセスは少し時間がかかる場合がありますので、しばらくお待ちください。cnpm はインストールされていますが、できるだけ使用しないでください。
インストール場所は次のとおりです。
この時点で、npmのインストールは正常に終了しました。以上が今日の内容です。この記事では npm のインストールについて簡単に紹介するだけです。さらに多くの知識が私たちを待っています。これで、vue-cli の学習の旅を始めることができます~ 皆さん、私の他の記事vue-cli の詳細なチュートリアル を
読んでください。皆さんのお役に立てば幸いです~