とうとう40歳になってしまった@mikedaです。
npmスクリプトを実行する時にコマンドライン引数とかで挙動を切り替えたいなと思うことがあります。
そのような場合、リスタではnpm-configのPer-Package Config Settingsを使って切り替えています。
今日はその簡単な使い方について紹介します。
※ Per-Packageではないグローバルなconfigもありますが、今回は触れません。
使い方
動作確認用のpackage.jsonを作成します。
mkdir sample cd sample npm init npm i
package.jsonの中身はこうなりました。
{ "name": "sample", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1" }, "author": "", "license": "ISC" }
Per-Package Configの埋め込みかた
scriptsの中に$npm_package_config_<変数名>という形式で変数を埋め込めます。
デフォルト値はconfigとして設定しておくことができます。
{ "name": "sample", "config": { "xxx": "111", "yyy": "222" }, "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1", "show-config": "echo app:$npm_package_config_xxx env:$npm_package_config_yyy" }, "author": "", "license": "ISC" }
npm scriptを実行するとデフォルト値が使われていることが確認できます。
% npm run show-config > sample@1.0.0 show-config /Users/mikeda/work/study/npm/sample > echo xxx : $npm_package_config_xxx;echo yyy : $npm_package_config_yyy xxx : 111 yyy : 222
コマンドライン引数で渡す
値を設定する簡単な方法はコマンドライン引数で指定することです。
% npm run show-config --sample:xxx=abc --sample:yyy=xyz > sample@1.0.0 show-config /Users/mikeda/work/study/npm/sample > echo xxx : $npm_package_config_xxx;echo yyy : $npm_package_config_yyy xxx : abc yyy : xyz
setコマンドでセットする
毎回コマンドラインで渡すのが面倒な場合は、npm config setで永続的に設定しておけます。
% npm config set sample:xxx hoge % npm config set sample:yyy fuga % npm run show-config > sample@1.0.0 show-config /Users/mikeda/work/study/npm/sample > echo xxx : $npm_package_config_xxx;echo yyy : $npm_package_config_yyy xxx : hoge yyy : fuga
設定されている値はnpm config listで確認出来ます。
% npm config list ; cli configs metrics-registry = "https://registry.npmjs.org/" scope = "" user-agent = "npm/6.14.5 node/v12.13.1 darwin x64" ; userconfig /Users/mikeda/.npmrc sample:xxx = "hoge" sample:yyy = "fuga"
この値は~/.npmrcに保存されています。
% cat ~/.npmrc sample:xxx=hoge sample:yyy=fuga
不要になったらnpm config deleteで削除します。
% npm config delete sample:xxx % npm config delete sample:yyy
実際にどのように使っているか
expoのconfigファイルやrelease-channelの切り替えに使っています。
{
"name": "sample",
"config": {
"app": "demo",
"env": "development"
},
"scripts": {
"start": "expo start --config app.${npm_package_config_app}-${npm_package_config_env}.json",
"prestart": "npm run show-config",
"publish": "expo publish --release-channel $npm_package_config_env --config app.${npm_package_config_app}-${npm_package_config_env}.json",
"show-config": "echo app : $npm_package_config_app;echo env : $npm_package_config_env"
}
}
まとめ
npm-configのPer-Package Config Settingsを使ってnpm-scriptsの挙動を切り替える方法紹介しました。
欠点は$npm_package_config_<変数名> という書式が長すぎてpackage.jsonがめちゃ読みづらくなることですね。。。
もっといい方法があればぜひ教えて下さい！
