Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
26
Help us understand the problem. What is going on with this article?
@sugurutakahashi12345

package-lock.json ってなに?

初心者に向けての答え

package-lock.json について、とりあえず以下を守ればプロジェクトに迷惑をかけません。

  • 直接編集してはいけません
  • 基本的に無視していいファイルです
  • 削除してはいけません
  • npm install コマンド実行時に変更されることもありますが、そのときに発生する変更は気にしなくて大丈夫です
  • マージリクエスト(プルリクエスト)する際に package-lock.json に変更があった場合は、その変更も含めて提出します

※ これは package.json についても同じことが言えます。

もうちょっと知りたい人に向けての答え

  • package-lock.json は npm install 実行時に新規作成・更新される
  • package-lock.json には npm install で実際にインストールしたパッケージ情報が記載されている
  • package-lock.json を使用してパッケージをインストールする際には npm ci コマンドを実行する
  • npm ci コマンドを実行する主なユースケースとしては CI 実行時や git clone 後の動作確認などで使用する
  • 上記の用途があるので package-lock.json は Git で管理したほうがいいファイルである

解説

新規作成・更新されるタイミング

package-lock.json は npm install 実行時に作成・更新されるファイルです。

npm install 実行時は以下のような挙動をしています。

  1. package.json の内容を更新する
  2. package.json の内容をもとに node_modules のディレクトリにパッケージをインストールする
  3. node_modules に実際にインストールされたパッケージのバージョン情報が package-lock.json に記述される

package.json との比較

以下のように記述内容に差があります。

  • package.json
    • インストールすべきパッケージのバージョンの範囲
    • その他もろもろ(npm-scripts など)
  • package-lock.json
    • npm install によって実際にインストールしたパッケージのバージョンのみ

package-lock.json を使用する方法

npm install の代わりに npm ci というコマンドを実行すると package-lock.json を元にパッケージをインストールして node_modules を作成してくれます。

# package-lock.json のバージョンで node_modules を作成するとき
$ npm ci

裏を返すと、npm ci というコマンドを実行しなければ package-lock.json は使用されません。

npm install と npm ci の違い

npm cinpm install の要点をまとめると以下のようなことがあげられます。

  • npm cinpm install と同じように全ての依存パッケージをインストールする
  • npm install コマンド実行によって package-lock.json を更新することがある
  • npm ci コマンド実行によって package-lock.json は更新されない
  • npm ci コマンド実行すると node_modules をすべて削除してからパッケージをインストールする

npm ci の使い所

npm ci の使用頻度の高いユースケースとしては CI 実行時があげられます。

理由としては、package-lock.json が勝手に更新されるのを防いだり、package-lock.json を参照することでインストールするバージョンを固定して node_modules の内容を同じにするためです。

同様の理由から、新規参画者が git clone して動作を確認する場合なども npm ci が用いられます。

(※ ただし CI の速度を求めるなら npm ci は実行時間がやや長いため node_modules をキャッシュして npm install を用いることもあるらしいです。ですが、最初からキャッシュする仕組みを作るよりは、実行時間が長くて困るというような問題が発生してから、そのような対応をすればいいと思います。)

よくある使われどころは以下の通りになります。

  • CI 実行時
  • git clone 直後の動作確認
  • 何かのトラブルで node_modules を空にしてやり直すとき
  • 過去の状態を復元するとき

Git で管理すべきファイル?

答えは Yes です。

上記のように npm ci コマンドを使用して、パッケージをインストールする用途があるので、package-lock.json は Git で管理すべきファイルになります。

ちなみにインストールするパッケージに何か変更があると、マージリクエスト(プルリクエスト)時に、package-lock.json に大量の差分が出てくるかと思いますが、それが、npm install 時に自動的に更新された変更であれば、基本的に無視して大丈夫です。

まとめ

  • package-lock.json は npm install 実行時に新規作成・更新される
  • package-lock.json には npm install で実際にインストールしたパッケージ情報が記載されている
  • package-lock.json を使用してパッケージをインストールする際には npm ci コマンドを実行する
  • npm ci コマンドを実行する主なユースケースとしては CI 実行時や git clone 後の動作確認などで使用する
  • 上記の用途があるので package-lock.json は Git で管理したほうがいいファイルである
26
Help us understand the problem. What is going on with this article?
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
sugurutakahashi12345
このサイトへの掲載内容はあくまで私個人の見解であり、所属企業における立場、戦略、意見を代表するものではありません。iOS、Swift、SwiftUI、Flutter、UI/UX、Firebase、AWS、Docker、CI/CD

Comments

No comments
Sign up for free and join this conversation.
Sign Up
If you already have a Qiita account Login
26
Help us understand the problem. What is going on with this article?