Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
12
Help us understand the problem. What is going on with this article?
@msya0408

yarn xxxxしたらgyp ERRが出たときの対処法

More than 1 year has passed since last update.

はじめに

Qiita初投稿です。緊張。
渋谷の事業会社でしがないフロントエンドエンジニアをやっています。

なぜgyp ERRに出会ってしまったか①

弊社のフロントエンドグループでは現在、レガシーな開発環境を脱却し、当たり前に品質を担保できる環境づくりを行っています。
その一環として、みんな大好きESLintを導入しようと企みました。

インストールコマンドを打って、 .eslintrcをちょちょっと作成したら導入完了でしょ\(^o^)/とか思って

yarn add -D eslint

を実行したら

$ yarn add -D eslint
yarn add v1.15.2
[1/4] 🔍  Resolving packages...
[2/4] 🚚  Fetching packages...
warning Pattern ["glob@latest"] is trying to unpack in the same destination "~/node_modules/glob" as pattern ["glob@^7.1.3","glob@^7.1.0","glob@^7.1.3"]. This could result in non-deterministic behavior, skipping.
error eslint@5.16.0: The engine "node" is incompatible with this module. Expected version "^6.14.0 || ^8.10.0 || >=9.10.0". Got "8.9.4"
error Found incompatible module

見事にエラーが出ました。

error eslint@5.16.0: The engine "node" is incompatible with this module. Expected version "^6.14.0 || ^8.10.0 || >=9.10.0". Got "8.9.4"

弊プロダクトでは、Node.jsのv8.9.4を使用しているのですが、ESLint推奨のNode.jsのバージョンと合っていないらしいです。
v9.10.0以上であれば良さそうなので、Node.jsを最新のLTSにアップデートすることになりました。

(ついでにNode.jsのリリースノートを眺めていたら、v8は2019年いっぱいでEnd-of-Lifeらしいのでちょうどよかったです)

なぜgyp ERRに出会ってしまったか②

前段でNode.jsのアップデートをすることになったので、せっせと調査をはじめました。

弊プロダクトではNodeのバージョン管理ツールとしてnvmを使用していて、
.nvmrcを1行変更すれば終了ということがわかりました(ラッキー)。

いざ.nvmrcv10.15.3(2019/5/9時点でのLTS最新版)に編集してyarn installを実行すると

$ yarn install

~~~略~~~

warning Error running install script for optional dependency: "~/node_modules/utf-8-validate: Command failed.
Exit code: 1
Command: node-gyp rebuild
Arguments: 
Directory: ~/node_modules/utf-8-validate
Output:

~~~略~~~

5 warnings and 1 error generated.
make: *** [Release/obj.target/validation/src/validation.o] Error 1
gyp ERR! build error 
gyp ERR! stack Error: `make` failed with exit code: 2
gyp ERR! stack     at ChildProcess.onExit (~/node_modules/node-gyp/lib/build.js:262:23)
gyp ERR! stack     at ChildProcess.emit (events.js:189:13)
gyp ERR! stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:248:12)
gyp ERR! System Darwin 18.5.0
gyp ERR! command \"~/.nvm/versions/node/v10.15.3/bin/node\" \"~/node_modules/.bin/node-gyp\" \"rebuild\"
gyp ERR! cwd ~/node_modules/utf-8-validate

gyp ERRに出会いました。
.nvmrcを1行変更すれば終了!なんて都合のいい話はないですね。

エラーの原因

gyp ERRとはなんらかのモジュールがNode.jsのバージョンに合っていない場合に起こるエラーのようです。
(エラーの詳細は調べていないので、気になる方は調べてみてください。教えていただけるとさらに嬉しいです)

今回はCommand failed.となっているutf-8-validateというモジュールが原因のようなので、そこから探っていきます。

package.jsonのdependenciesには記載のないモジュールのため、使用しているなんらかのモジュールが依存しているモジュールであることがわかります。

そのなんらかのモジュールを特定するのに使うのが、yarn whyコマンドです。

yarn why

yarn whyコマンドは、引数に渡したモジュールがどのモジュールに依存しているかを明らかにするコマンドです。
package.jsonに記載のあるモジュールにたどり着くまでyarn why xxxxを繰り返します。

$ yarn why utf-8-validate
yarn why v1.15.2
[1/4] 🤔  Why do we have the module "utf-8-validate"...?
[2/4] 🚚  Initialising dependency graph...
[3/4] 🔍  Finding dependency...
[4/4] 🚡  Calculating file sizes...
=> Found "utf-8-validate@1.2.2"
info Reasons this module exists
   - "_project_#ws" depends on it
   - Hoisted from "_project_#ws#utf-8-validate"

utf-8-validatewsというモジュールで使用されていることがわかります。

$ yarn why ws
yarn why v1.15.2
[1/4] 🤔  Why do we have the module "ws"...?
[2/4] 🚚  Initialising dependency graph...
[3/4] 🔍  Finding dependency...
[4/4] 🚡  Calculating file sizes...
=> Found "ws@0.8.0"
info Has been hoisted to "ws"
info Reasons this module exists
   - "workspace-aggregator-4046ff3c-1c25-4458-aaf7-3f9e6df87138" depends on it
   - Hoisted from "_project_#hoge#sc5-styleguide#socket.io#engine.io#ws"
   - Hoisted from "_project_#hoge#sc5-styleguide#socket.io#socket.io-client#engine.io-client#ws"

wshogeディレクトリ内で使用されているsc5-styleguideというモジュールで使用されていることがわかりました。

fix

ws@0.8.0Node.js@10.15.3では使用することができないということがわかったので、
sc5-styleguideをアップデートして、エラーの起きないバージョンにするか、不要であれば削除することでgyp ERRは起きなくなります(はず)。

今回はsc5-styleguide@1.0.0sc5-styleguide@2.2.0にアップデートすることでエラーは解消されました。

さいごに

あまり再現しにくいエラーかとは思いますが、どなたかの参考になれば幸いです。

ライブラリのアップデートは骨の折れる作業が多いとは思いますが、
あとに残しておくと自分の首を締めることになりかねないのでこまめにアップデートしていくといいかと思います。
(Angularのアップデートもやらなきゃ...!)

今後も開発環境改善をしていく中で、面白い内容などがあれば記事にしていきたいと思っていますのでよろしくおねがいします!

12
Help us understand the problem. What is going on with this article?
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
msya0408
渋谷の転職サービスを運営している会社でフロントエンドエンジニアをしています

Comments

No comments
Sign up for free and join this conversation.
Sign Up
If you already have a Qiita account Login
12
Help us understand the problem. What is going on with this article?