サブフォルダにある package.json で npm install したいときの prefix オプションを実験してうまくいったメモ
サブフォルダにある package.json で npm install したいときの prefix オプションを実験してうまくいったメモです。
やりたいこと
こちらで、プロジェクトフォルダの直下の階層に package.json を集めて対応したのですが、Node-RED + Svelte や Node-RED + Vue CLI +Vue 3 のようなフロントエンドの構造は子フォルダへ集約できるのに、バックエンドである Node-RED が子フォルダへ集約できないのって何とかしたいなあと思ったのがきっかけです。
ようやく調べたいワードが定まり先に進んでいる方々の知見に行きつきまして、 prefix オプションをつければよいことが分かりました。
- サブディレクトリでもnpmコマンドを複数同時に実行したい - Qiita
- package.jsonのあるディレクトリパスを指定してnpm installを実行する - Motomichi Works Blog
- npm で package.json がカレントディレクトリにない場合 - Please Sleep
ただ、npm で prefix オプションがついたり install あとにフォルダを指定する npm --prefix ./sub_project install ./sub_projectの挙動がイマイチピンと来ておらず実験してみます。
今回求めているのは「プロジェクトフォルダ直下からサブフォルダ内の package.json を元にサブフォルダでインストールが行う」という動作です。
プロジェクトを作る

まず適当なプロジェクトフォルダを作ります。
mkdir sub_project
sub_project というフォルダを作ります。
cd sub_project
フォルダを移動し、
npm init -y
package.json を作ります。

このようなフォルダ構造になりました。
試しに Milligram を加えてみる
適当なパッケージということでサッと入りそうな Milligram パッケージを加えてみた package.json がこちらです。
{
"name": "sub_project",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"keywords": [],
"author": "",
"license": "ISC",
"dependencies": {
"milligram": "^1.4.1"
}
}
これは npm i でインストールしたものではなくて、手入力で入れたものです。つまりまだ、 node_modules フォルダはありません。あとは npm i を行えばインストールされるわけですね。
準備完了。
実行してみる
npm --prefix ./sub_project install ./sub_project
これをプロジェクトフォルダ直下で実行してみます。

おお、無事 sub_project フォルダ内で node_modules フォルダが登場してインストールされました。これは「プロジェクトフォルダ直下からサブフォルダ内の package.json を元にサブフォルダでインストールが行う」ってやつですね。
参考文献からも CI のような仕組みや自動化などを想定して使い方が書かれていて、わたしも別フォルダ npm i 的なものは求めていてフロントエンド用のフォルダだけ何かしたいといった、色々な用途に応用できそうで楽しみです!