JavaScript(Node.js), npmパッケージ使いかたまとめ

Node.jsインストール

Node.jsをダウンロードし、インストールすれば開発環境は構築完了。

コマンドからのJavaScript実行、各種パッケージと呼ばれるものをインストールして使うことが可能になる。

node操作

Nodeの操作は基本シンプル。つぎの2つだけ覚えておけば一旦大丈夫。

  1. Node.jsのバージョン確認
  2. コマンドでのJavaScript実行

1. Node.jsのバージョン確認

つぎのコマンドでバージョン、インストール済みか確認できる。

$ node -v
v16.13.2

2. コマンドでのJavaScript実行

# [モジュール名] --- 実際のモジュール名
$ node /path/to/[モジュール名].js

npmパッケージ管理

npmについては、一旦つぎの4つを覚えておけばOK。

  1. npmの初期化
  2. パッケージのインストール
  3. パッケージのアンインストール
  4. パッケージのリスト取得

ここからは、くわしく見ていこう。

1. npmの初期化

初期化をすると、package.jsonがnpm initしたフォルダに作成され、npm iでパッケージをインストールできるようになる。npm initしないでnpm iのインストールをしようとした場合はエラーが返るので注意。

$ npm init

状況コマンドを実行するとつぎの質問に答えていくと、package.jsonが作成される。すべてEnterで空白のままにしてもOK。

package name: (desktop) → パッケージの名前
version: (1.0.0) → アプリのバージョン
description: → 概要説明
entry point: (index.js) → mainで実行されるファイル
test command: → テスト用にコマンドがあれば
git repository: → Gitのリポジトリ
keywords: → 
author: → 作成者
license: (ISC) → コードのライセンス設定

2. パッケージのインストール

# インストール i は installの略 デフォルトで--saveオプションがつく
# アプリ使用時にも使用するパッケージ
$ npm i [npmパッケージ名]

# -dオプションは--save-devで開発側としてインストール
# 開発時にしか使用しないとき設定
$ npm i -d [npmパッケージ名]

# -gオプションはglobalの略
$ npm i -g [npmパッケージ名]

インストールが完了すると、package.jsonにインストール情報がつぎのように自動記載される。

# package.json
{
  "dependencies": {
    "axios": "^0.26.1",
    "express": "^4.17.3"
  },
  "devDependencies": {
    "jest": "^27.5.1"
  }
}
  • dependencies -- npm i のデフォルト設定または --save オプションを設定
  • devDependencies -- npm i で --save-dev オプションを設定

dependenciesは本番環境でも使うパッケージ。devDependenciesは開発時にしか使わない(jest, electronなど)パッケージで覚えておくといい。

3. パッケージのアンインストール

$ npm uninstall [npmパッケージ名]

4. パッケージのリスト取得

$ npm list
$ npm -g list

npm config

  1. configに設定してあるリスト取得
  2. プロキシの設定
  3. キャッシュのクリア

1. configに設定してあるリスト取得

$ npm config list

2. プロキシの設定

$ npm config set proxy http://{host}:{port}
$ npm config set https-proxy http://{host}:{port}

関連記事→npm proxy 407エラーを解決する方法(Electronにも対応)

3. キャッシュのクリア

$ npm cache clean --force

jsファイル内でのパッケージインポート方法

const モジュール名 = required("モジュール名");
const { 特定のメソッド,クラス名 } = required("モジュール名");