webpack の EnvironmentPlugin で十分だった

これまで DefinePlugin でこう書いてました。

new webpack.DefinePlugin({
  'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV)
})

でも実は、 EnvironmentPlugin 使えば、こう書けるんです。

new webpack.EnvironmentPlugin([
  "NODE_ENV",
  "HOGE"
])

入力:

if (process.env.NODE_ENV === 'local') {
  console.log('local!')
}

if (process.env.NODE_ENV === 'dev') {
  console.log('dev!')
}

console.log(process.env.HOGE)

NODE_ENV=dev HOGE=fuga webpack としたときの出力:

if (false) {
  console.log('local!')
}

if (true) {
  console.log('dev!')
}

console.log(("fuga"))

デフォルト値を指定したければ webpack.config.js に process.env.HOGE = process.env.HOGE || 'hoge' こんな感じで書けば OK.

とにかく JSON.stringify がだるいし、自分の用途的には DefinePlugin 使う理由がなくなってしまいました。どうしても __HOGE__ とか定義したい人向けってことかなぁ。