Create-react-app後にyarn startが出来ない

具体的には,create-react-app my-appした後にプロジェクトディレクトリに移動cd my-appしたのち,yarn startを実行したが以下のエラーで実行できなかった.

terminal.

yarn start

terminal.

yarn run v1.17.3
$ react-scripts start
Attempting to bind to HOST environment variable: x86_64-apple-darwin13.4.0
If this was unintentional, check that you haven't mistakenly set it in your shell.
Learn more here: https://bit.ly/CRA-advanced-config

events.js:180
      throw er; // Unhandled 'error' event
      ^

Error: getaddrinfo ENOTFOUND x86_64-apple-darwin13.4.0
    at GetAddrInfoReqWrap.onlookup [as oncomplete] (dns.js:60:26)
Emitted 'error' event at:
    at GetAddrInfoReqWrap.doListen [as callback] (net.js:1412:12)
    at GetAddrInfoReqWrap.onlookup [as oncomplete] (dns.js:60:17) {
  errno: 'ENOTFOUND',
  code: 'ENOTFOUND',
  syscall: 'getaddrinfo',
  hostname: 'x86_64-apple-darwin13.4.0'
}
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

コマンドだけで開発が始められるはずでは...と少しハマったので解決法をメモしておきます。

動作環境

macOS Mojave 10.14.15
node.js 12.7.0

原因はなんだ

まずよくある解決法を示します.

terminal.

npm install npm
yarn add yarn

自分の場合は上記を実行しても動かなかったので,エラーログをちゃんと読んでみたところ以下の冒頭部分が気になりました.

terminal.

Attempting to bind to HOST environment variable: x86_64-apple-darwin13.4.0
If this was unintentional, check that you haven't mistakenly set it in your shell.

日本語に訳すとこうです.

「HOST環境変数にバインドしようとしています：x86_64-apple-darwin13.4.0
これが意図的でない場合は、誤ってシェルに設定していないことを確認してください。」

ふむ,create-react-appで作ったアプリからローカルサーバーを動かす時に,HOST変数をbindできなくて困ってるっぽいですかね.

そこで確認として以下を実行しました.

terminal.

echo $HOST

すると以下の結果が.

terminal.

x86_64-apple-darwin13.4.0

さっきの文と同じこと言ってますね.$HOSTにすでに値が入っているので,ローカルサーバーの立ち上げができない、的なことでしょうか.

上記エラーログを元に検索をしていると以下のstackoverflowにて同様の事例を発見できました.

これによれば,とりあえず$HOSTを解放してあげることで解決しそうです.そこで,以下のコマンドを実行します.

terminal.

unset HOST

これで$HOSTのバインドが解放されました.
念の為$HOSTの値を確認してみましょう.

echo $HOST

すると上記のように何も表示されなくなりました.

以上を確認したのち,プロジェクトディレクトリでyarn startを実行してみます.

terminal.

yarn start

すると,macからネット接続関連の警告が飛んでくるのでOKを出します.すると

できました！

まとめ

一応unset HOSTで解放されるのはカレントディレクトリの変数だけっぽいんですが,HOSTとか恐ろしい名前はできるだけ触りたくないんですね...

こちらの記事にて安全のためHOSTに他の値をバインドしている方がいらっしゃったので、参考として載せさせていただきます.

https://medium.com