3
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

package.json の config の使い方について

Last updated at Posted at 2020-10-18

config

package.json の config に項目を追加すると npm-scripts 実行時に環境変数として $npm_package_config_xxx ( xxx はプロパティ名) という形で使用できるようになります。

サンプル

npm-scripts で使用する

package.json
{
  "name": "foo",
  "config": {
    "foo": "bar",
    "dev": {
      "port": 8080
    }
  },
  "scripts": {
    "start": "node ./index.js",
    "dev": "http-server -p $npm_package_config_dev_port"
  }
}

この場合、 $ npm run dev と実行すると $npm_package_config_dev_port8080 と解釈されます。

JavaScript のプログラムから使用する

npm-scripts だけではなく、JavaScript のプログラムからも以下のように使用することができます。

index.js
console.log(process.env.npm_package_config_dev_port); # 8080 と出力される
console.log(process.env.npm_package_config_foo_bar); # baz と出力される

使い所

正直、使い所はあんまり思いつきません。

可能であれば npm-scripts はコマンドライン引数を -- のオプションでコマンドに渡せるため、そっちのコマンドライン引数を使ったほうがいいと思います。

環境設定の外部ファイルで環境変数を読み込ませるよりは良さそうですが、 ローカルでの環境情報を package.json に書き込むことになってしまい、git で package.json が競合することになりそうです。

どうしても npm-scripts のコマンドライン引数で連携できないケース(連携しようとすると npm-scripts がやたら複雑になるケース)や npm-all-run などで複数箇所の設定を同時に行いたい時など、かなり使用するケースは限られると思います。

3
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
3
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?