browserslistの設定を環境に応じて使い分けたり、参照する方法

browserslistについて調べたことをまとめる。

browserslistの設定を環境に応じて使い分ける

browserslistは下記のように環境に応じて異なるブラウザクエリを指定することができる
BROWSERSLIST_ENVまたはNODE_ENVの変数に応じて環境をスイッチできる

  "browserslist": {
    "production": [
      "> 1%",
      "not dead"
    ],
    "development": [
      "last 2 versions",
      "not dead"
    ]
  }

browserslistの設定を参照する

下記のようなクエリを使用すれば別パッケージのBrowserslist設定を参照できる

  "browserslist": [
    "extends browserslist-config"
  ]

共有用のbrowserslistパッケージ作成

共有用のbrowserslistパッケージを作成する場合はbrowserslist-config-xxx/index.jsもしくはbrowserslist-config/index.jsを作成して、exportする

module.exports = [
  '> 1%',
  'not dead'
]

参考