Quantcast
Channel: Node.jsタグが付けられた新着記事 - Qiita
Viewing all articles
Browse latest Browse all 9233

package.jsonにfilesを書かないあなたは、誰かを少しだけ不幸にしています

$
0
0
先に結論だけ package.jsonにfilesフィールドを指定すると、node_modulesに保存されるファイルサイズが減ります。 はじめに この記事は、npmのpackage.jsonに指定するフィールド、filesの指定方法と効用を解説、共有するためのものです。 想定する読者 この記事は、以下の読者を想定して書かれています。 JavaScriptの開発経験がある npmを使ったことがある npmやGitHubでnpmモジュールを公開している 想定する環境 この記事は、以下の環境を想定して書かれています。記事を読む前に、お手元の環境をご確認ください。 $ npm --version 7.15.1 filesフィールドとは filesフィールドとは、package.jsonファイル内の設定フィールドです。このフィールドはnpmパッケージがインストールされたとき、どのファイルをnode_modulesにコピーするかを設定します。 たとえば、以下のようなnpmパッケージ用のリポジトリがあるとします。 example-project/ ├ src/ │ ├ srcA.js │ └ srcB.js ├ lib/ │ └ bundle.js ├ esm/ │ └ module.js ├ __test__/ │ ├ testA.spec.js │ └ testB.spec.js ├ package.json ├ LICENSE ├ jest.config.js └ README.md package.jsonには、以下のようにfilesフィールドが設定されています。 ▼package.json { "name": "example-project", "files": [ "lib", "esm" ], } このnpmパッケージをインストールします。 npm install --save-dev example-project すると、node_modulesには以下のようにファイルがインストールされます。 node_modules/ └ example-project/ ├ lib/ │ └ bundle.js ├ esm/ │ └ module.js ├ package.json ├ LICENSE └ README.md filesフィールドに指定されていないファイルは、node_modulesにはインストールされません。 filesフィールドの挙動 filesフィールドの挙動を、公式ドキュメントから読み解いていきます。 ファイルの指定方法は? filesフィールドにはstring配列を指定します。stringの中身は.gitignoreなどでおなじみのglobパターンを指定します。 省略するとどうなるか filesフィールドは省略可能です。省略した場合["*"]として解釈されます。このパターンはすべてのファイルにマッチします。 .npmignoreと併用するとどうなるか .npmignoreとfilesを併用した場合、ルートディレクトリとサブディレクトリで挙動が異なります。 ルートディレクトリの場合 : filesフィールドが優先されます。 サブディレクトリの場合 : .npmignoreが優先されます。 指定に関係なく無視されるファイルと、指定しても含まれるファイル filesフィールドの設定にかかわらず、必ずパッケージに含まれるファイルと無視されるファイルがあります。詳しいリストは公式ドキュメントを参照してください。 無視されるファイル .gitディレクトリやpackage-lock.jsonなど、インストール先に影響を与えないファイルは無視されます。 含まれるファイル package.jsonやLICENCEなど、インストール先に影響を与えたり尊重されるべきファイルはfilesフィールドの設定にかかわらずパッケージに含まれます。 filesフィールドの効用 filesフィールドを指定することで、インストール先のnode_modulesディレクトリのファイルサイズを減らせます。 たとえば以下のようなファイルはパッケージの動作に影響を与えません。filesフィールドを設定して除外するべきです。 単体テストファイル バンドル / トランスパイル前のソースファイル バンドル / トランスパイルのための設定ファイル(webpack.config.jsやtsconfig.json) APIドキュメント サンプルコード 以上、ありがとうございました。

Viewing all articles
Browse latest Browse all 9233

Trending Articles