tl;dr
webpackJsonp の Global 名を変更するオプションは output.jsonpFunction.
自分のとこと何らかの事情で同居する外製 js が共に webpack を使い、共に CommonsChunkPlugin を使い、共にデフォルト設定のままだと Global 名が衝突して上書きされて惨劇が起こる。
自分とこのサービスを表す特異な名前にしておくとぶつかりづらいと思う。
https://webpack.github.io/docs/configuration.html#output-jsonpfunction
前置き
- うちのサービスでは webpack を使ってる
- webpack の標準 plugin である CommonsChunkPlugin を使ってる。この plugin は multi entry points なサイトで効果的。複数 entry points 間で共通の module を 1 file に集めてくれる
- 世は js を concatenate して 1 page で読み込む js は出来るだけ減らすのが主流。その状況で multi entry points だと共通で利用する module も各 entry point ごとにくっつけてしまいサイズが大きくなる。あと uglify も毎回実行されて production 設定での transpile がクソ遅くなる。それらのデメリットを軽減してくれる
- see https://github.com/webpack/webpack/tree/master/examples/multiple-commons-chunks
- この plugin は entry points ごとに必要な module を Global object に入れる。つまり Global 汚染する。デフォルトではこの名前は
webpackJsonp
ある日の出来事
同僚「weakbosonさん、A社のjs SDK使うとエラーが出るんですけど。」
私「えー、なんてエラー？」
同僚「undefined is not function とかなんとか。A社SDKの中でエラーが出てます。」
私「うちのCommonsChunkとA社SDKの読み込み順を変えるとどうなる？」
同僚「今度はうちのjsの中でエラーが出て動かなくなりました。」
私「……だいたい察しがついた。」
調べて設定のことを知るとデフォルト設定のままだったのカコワルイなあと思い、こちらが退きました。