kuntalog

頭の整理と書く練習。師匠募集中。

yarn addのwarningメッセージを読む

js書き始めて大体二ヶ月(コンスタントではないけど)、パッケージ回りの雰囲気がよくわからないまま素通りしてしまっているのでここらではっきりさせておきたい。特にwarningメッセージはよく出る割に理由が分からないものが多くもやもやしていました。とりあえず@webpack-cli/initのインストールの際に出るwarningメッセージを読んでみました。

$ yarn upgrade
yarn upgrade v1.13.0
[1/4] 🔍  Resolving packages...
warning @webpack-cli/init > jscodeshift > babel-preset-es2015@6.24.1: 🙌  Thanks for using Babel: we recommend using babel-preset-env now: please read babeljs.io/env to update!
warning @webpack-cli/init > jscodeshift > nomnom@1.8.1: Package no longer supported. Contact support@npmjs.com for more info.
warning @webpack-cli/init > @webpack-cli/utils > jest > jest-cli > prompts > kleur@2.0.2: Please upgrade to kleur@3 or migrate to 'ansi-colors' if you prefer the old syntax. Visit <https://github.com/lukeed/kleur/releases/tag/v3.0.0\> for migration path(s).
[2/4] 🚚  Fetching packages...
[3/4] 🔗  Linking dependencies...
warning "@webpack-cli/init > @webpack-cli/generators > inquirer-autocomplete-prompt@1.0.1" has unmet peer dependency "inquirer@^5.0.0 || ^6.0.0".

1つ目 warning @webpack-cli/init > jscodeshift > babel-preset-es2015@6.24.1: 🙌 Thanks for using Babel: we recommend using babel-preset-env now: please read babeljs.io/env to update!

https://dackdive.hateblo.jp/entry/2018/01/18/100000(https://dackdive.hateblo.jp/entry/2018/01/18/100000)

このブログを参考にさせていただきました。

`babel-preset-es2015` とか `babel-preset-env` とか `@babel/preset-env` というのはES2015で書かれたコードをES5に変換するためのもの(ES2014、、じゃないよなぁ。。。)

https://babeljs.io/docs/en/next/babel-preset-env.html(https://babeljs.io/docs/en/next/babel-preset-env.html)

こちらを読むと要はjsコードのデプロイターゲットに応じて文法の対応具合が違うので、こいつが必要なパッケージをよしなに管理してくれるみたい。で今推奨(というか残っているというか?)なのが `@babel/preset-env` だそうです。

で、とりあえず `.babelrc` とかを書き換えればいいのねってなるんですが、なんで `jscodeshift` は未だに `babel-preset-es2015` を使っているのかと思って見てみたら全然アップデートされて `@babel/preset-env` を使ってた、あれ?なので`@webpack-cli/init` の方のpackage.jsonを見てみると `jscodeshift` のバージョンが0.5.1になってる。これが出たのが2018/06/05らしくそのときのpackage.jsonとか見るとまだ全然 `babel-preset-es2015` を使っている。。

https://github.com/facebook/jscodeshift/blob/595b15cda4f52673cad8fe3ae65c12e334966dbf/package.json(https://github.com/facebook/jscodeshift/blob/595b15cda4f52673cad8fe3ae65c12e334966dbf/package.json)

で `@babel/preset-env` に移ったのがこのコミットで

https://github.com/facebook/jscodeshift/commit/ac14f270f02208de3fbd576b9a2f27d96f55603b#diff-b9cfc7f2cdf78a7f4b91a753d10865a2(https://github.com/facebook/jscodeshift/commit/ac14f270f02208de3fbd576b9a2f27d96f55603b#diff-b9cfc7f2cdf78a7f4b91a753d10865a2)

それが入ったのが0.6.0らしいですね。0.6.0が出たのが去年の12/04なのでそこの移行がまだできてないのかな?見る限りまだ対応してる感じが全然ない。。

とか思っていろいろ見てたらなんだか動きづらい状況があるみたい

package.jsonのヒストリを見てたらこんなのが出てきた。 `jscodeshift`のバージョンを0.5.1で固定しようとしてるPRらしい。マージされてリバートされてる。CIが通らなかったらしい。

https://github.com/webpack/webpack-cli/pull/711(https://github.com/webpack/webpack-cli/pull/711)

なんで最新版入れないのかなってリンクをたどる

https://github.com/webpack/webpack-cli/issues/697(https://github.com/webpack/webpack-cli/issues/697)

Due to the recent problems happened to the npm world, I'd propose to lock all the versions of our dependencies and development dependencies

なんかあったっけなーと思いだしてみるとそういえばセキュリティ系の事件があったなと

https://qiita.com/mysticatea/items/aac027f9183ea9f0f9b1(https://qiita.com/mysticatea/items/aac027f9183ea9f0f9b1)

これの影響をさけるためにバージョンの固定をしようとしてるらしい、なるほど。メンテナって大変だなぁ。。(いつになったら0.6.2になるんだろ

2つ目 warning @webpack-cli/init > jscodeshift > nomnom@1.8.1: Package no longer supported. Contact support@npmjs.com for more info.

一個目と同じ。もうjscodeshift側では治ってるからはよ!

3つ目 warning @webpack-cli/init > @webpack-cli/utils > jest > jest-cli > prompts > kleur@2.0.2: Please upgrade to kleur@3 or migrate to 'ansi-colors' if you prefer the old syntax. Visit https://github.com/lukeed/kleur/releases/tag/v3.0.0\ for migration path(s).

jestのissue

https://github.com/facebook/jest/issues/7430(https://github.com/facebook/jest/issues/7430)

現行のJest 23ではアップグレードは多分しないとのこと、Jest24を待つべし。

4つ目 warning "@webpack-cli/init > @webpack-cli/generators > inquirer-autocomplete-prompt@1.0.1" has unmet peer dependency "inquirer@^5.0.0 || ^6.0.0".

これな。いつも見るやつ。 `hogehoge has unmet peer dependency hugahuga@1.2.3` 的なやつ。peerDependency分かってなしということでちゃんと調べた。

この辺読んだ

https://stackoverflow.com/questions/46928390/what-does-has-unmet-peer-dependency-mean-when-installing-a-package-with-yarn(https://stackoverflow.com/questions/46928390/what-does-has-unmet-peer-dependency-mean-when-installing-a-package-with-yarn)

https://yarnpkg.com/en/docs/dependency-types(https://yarnpkg.com/en/docs/dependency-types)

これを読むとあるパッケージAの依存先となるBに関して、Bがユーザー自身のコードの依存先でもある場合、複数のBが存在してしまうのを防ぐためにBをpeer dependencyにするらしい。で、このへんは自動でうまくやってほしいよねってことなんだけどAとユーザーコードでBのバージョンのコンフリクトとかいろいろ起きるよねということで今はwarningを出してるんだってさ。
なのでやることとしてはメッセージを見つつコンフリクトがないように必要なパッケージを入れることっぽい。

まとめ

しんどい。そしてwarningは調べてもどうしようもないというか無視してもいいのかという気持ちになる。。。
yarn upgradeをちゃんとやっていこうという気持ち。