昨日のDiscordチャットでこれについて話し合ったが、明らかにローカルIPのみをバインドすることは設計上の決定である。 私の意見では、Gatsbyは他のビルドツール（create-react-appまたはMeteor）のように動作し、ネットワークにアクセス可能な開発サーバーを備えている必要があります。

_httpteapot_：
gatsby development（v1またはv2）は、$ MY_COMPUTER_IP：8000を使用してローカルネットワークからアクセスできるようにポートをバインドできますか？
たとえばcreate-react-appのように

_ghardin137_
開発中または「ギャツビーサーブ」でのみ

_httpteapot_
開発中にその機能に興味がありますが、gatsbydevelopはネットワークにアクセス可能なポートを開きません
（問題が他のものでない限り）

_LekoArts_
たとえばdevip（npmパッケージ）を使用してローカルIPを取得し、-H $ YOURIP $ -p $ YOURPORT $を使用します

_ghardin137_
デフォルトでは、0.0.0.0でリッスンします
何でもいい
したがって、ネットワークにアクセスできる必要があります

_httpteapot_
ええと、それはうまくいくはずです。なぜなら、私は複数のネットワークで何度も試したことがあり、ネットワーク上の別のデバイスから開発サーバーに接続できなかったからです。

_ghardin137_
私はそれを本当に速く試すことができますが、私はそれがうまくいくとかなり確信しています

_httpteapot_
そしてそれは常にcreate-react-appやその他のツールに取り組んでいました

_LekoArts_
それは私にとってもうまくいきませんでした。 そのため、-Hフラグを使用します

_httpteapot_
私はLinuxを使用しています

_LekoArts_
Windows10はこちら

_ghardin137_
私のためにここで勝利10にうまく取り組んでいます

_httpteapot_
-Hフラグに慣れていないので、どのコマンドに追加すればよいですか？

_LekoArts_
ギャツビー開発-H％YOURIP $

_ghardin137_
私がサーブモードになっていたのを待つ
開発はローカルのみです

_httpteapot_
再現性があるのは良いことです：smiley：
そして-Hフラグは確かに機能しています

_ghardin137_
ええ、gatsbyビルドしてgatsbyサーブは機能します：smiley：

_httpteapot_
しかし、私のユースケースは開発モードと携帯電話でのテストです
それはかなり一般的だと思います

_LekoArts_
browserSync以降、はい

_ghardin137_
ええ

_httpteapot_
gatsbyレポで問題を開く必要がありますか？

_ghardin137_
これは意図したとおりに機能していると思いますが、そのフラグを文書化しておくと便利です

_httpteapot_
機能リクエストを開いてください
meteor + create-react-appがより直感的に機能する方法を見つけました

_ghardin137_
https://github.com/gatsbyjs/gatsby/issues/561

_ [GaiJin] XiaoDie_
@LekoArts Thx for -Hフラグトリック：slight_smile：

_ghardin137_
あなたがその情報でドキュメントを更新するためにPRを入れたいのなら、私は彼らがその情報にオープンであると確信しています：smiley：

_LekoArts_
https://www.gatsbyjs.org/docs/

_ghardin137_
おそらくそこにもオプションの完全なリストがあれば害はないでしょう：smiley：

_LekoArts_
私はかつてそのためのPRをしました
彼らはそれが好きではなかった

_ghardin137_
しかし、それは開発がローカルホスト上にのみあると言っています
それは理にかなっています

gatsby develop -H 0.0.0.0使用することもできます

ありがとう、@ mquandalle。

gatsby develop -H 192.168.1.100 -p 8000 （私はMacOSを使用しています）アプローチを使用すると、HMRホットリフレッシュが機能しなくなるように見えることを今後の作業/ディスカッションで必ず注意してください（少なくともこれまでの私の努力では）。

どのデバイスを使用していますか？ HMRはまだ私のために働きます。 FWIW私はMacとiPhoneを使用しています、おそらく彼らはお互いによく話します😄

こんにちは、 @ ryanditjia ：smile：

ご意見ありがとうございます。

MacOSでサーバーを実行していて、Chrome、Firefox、Safariを使用して、同じマシンで提供されているサイトにアクセスしています。 ローカルLANの他のデバイスは、iOSとAndroidの両方です。

正確には：

糸を使っています

package.json一部として次のスクリプトエントリがあります。

"scripts": {
    "build": "gatsby build",
    "dev": "gatsby develop",
    "dev-m": "gatsby develop -H 0.0.0.0 -p 8000",
    "test": "echo \"Error: no test specified\" && exit 1"
  },

yarn devを実行すると、現在サイトにサービスを提供しているマシンからhttp://localhost:8000を使用してローカルでのみサイトにアクセスできます。 HMRは正常に動作します。

yarn dev-mを実行すると、 http://192.168.1.10:8000 （サーバーのIP）を使用して、ローカルLAN上の他のデバイスからサイトにアクセスできますが、HMRは変更を自動的に更新しません。

HMRが実際にセットアップに取り組んでいる場合は、セットアップで私が試すことができる詳細について知りたいと思います。

率直に言って、私は@mquandalleに同意しcreate-react-appやMeteorように機能するはずですが、彼女が言ったように、これは設計上の決定です。

空のGatsbyデフォルトスターターを作成してみましたが、次のことがわかりました。

HMRは完全に機能しています

• gatsby develop -H $HOSTNAME -p 8000
  ホスト名は動的であるため、これは複数のマシンで作業する人に最適です。
  例：名前-iMac。 local：8000およびName-MacBook。 local：8000 （アクセスしやすいようにモバイルデバイスでこれら2つのアドレスをブックマークしています）
• gatsby develop -H 192.168.1.105 -p 8000
  IPのハードコーディングは、正確に美しく、または柔軟ではありません。

HMRは部分的に機能しています

• gatsby develop -H 0.0.0.0 -p 8000
  サーバーのIPは動的です。 私の場合、192.168.1.105：8000です。
  HMRはマシンで機能します（0.0.0.0:8000と192.168.1.105:8000の両方）。 ただし、ネットワークデバイス用ではありません。

同じことを経験しているかどうか確認できますか？

詳細な回答をありがとう、@ ryanditjia。

これが私がいるところです：

• gatsby develop -H $HOSTNAME -p 8000とgatsby develop -H 192.168.1.105 -p 8000どちらも、Gatsbyを実行しているサーバーとローカルLANデバイスから、それぞれホスト名とIPアドレスを介して、ホスト名でアクセスできますが、HMRはありません。

HMRが機能していないと言うときは、ファイル内のテキストを変更して保存するという簡単なテストを行っています。 何も起こらず、ブラウザ開発ツールコンソールにも何も表示されません。

変更を加えて保存した後、GatsbyサーバーからCTRL-C取得すると、ブラウザー開発ツールコンソールに次の警告が表示されます。

Update check failed: Error: Manifest request to http://server.local:8000/5bd5e2fb7d66e8b025f1.hot-update.json timed out. process-update.js:136
    at XMLHttpRequest.request.onreadystatechange (http://server.local:8000/commons.js:34:23)

• パラメータなしのgatsby-developは、Gatsby開発サーバーが実行されているマシンでのみアクセスを許可し、ローカルLAN上の他のデバイスからのアクセスは許可しません。 HMRは、ファイルへの変更を保存することによって発生したコンパイルのほぼ直後に更新されます。

それは奇妙だ。 きれいなギャツビースターターでこれを試しましたか？

確かに奇妙なことに、 @ ryanditjia ：confused：

健全性チェックとして、 gatsby new gatsby-blog https://github.com/gatsbyjs/gatsby-starter-blogを使用して、新たにダウンロードしてインストールしました。 悲しいことに、私の結果は以前と同じです。

gatsby new gatsby-example-site同じことを試しましたが、自動更新はありません。

ちなみに、私のgatsbyクライアントのバージョンは1.1.58ですが、1.1.52でも同じ問題が発生しました。

@ryanditjiaとまったく同じ結果が得られました。

gatsby 1.1.58（ gatsby-starter-fortyテスト済み）
npm 6.3.0
ノード8.11.3
ubuntu 16

問題：HMRは、ハードコードされたIPを使用している場合にのみ機能します

@ryanditjiaが提案したハードコードされたソリューション（ gatsby develop --host 192.168.0.18 --port 8000 ）は、HMRを使用して他のデバイスからアクセスできるため、非常にうまく機能しました。

注意点が1つあります（私は完全に共存できます）。自分のマシンのlocalhost:8000からアクセスできません。 代わりに、 192.168.0.18:8000またはMy-Mac.local:8000を使用する必要があります。

私が気付いたより大きな問題は、ネットワークに接続するときに常に同じローカルIPを持っているとは限らないことです。これは、 package.jsonのハードコードされたIPを常に変更する必要があることを意味します。

解決策：IPを動的に取得する

ローカルIPを動的に取得し、それを--host値として使用する方法が欲しかったのですが、最終的にはそれを機能させる方法をハックすることができました。 私のpackage.json ：

{
  "scripts": {
    "develop": "gatsby develop --host $(ifconfig | awk '/inet 192\\.168\\.[0-9]+\\.[0-9]+/{print $2}') --port 8000",
    // ... other scripts
  },
  // ... other package.json stuff
}

私は自分のマシン（macOS）でテストし、Gatsbyバージョン2.0.0-rc.11を使用しているだけなので、コピーしてpackage.json貼り付けて動作させることができるかどうかはわかりません。 しかし、それは他の人が独自のカスタムソリューションを作成するのに役立つ可能性があります。

コードの簡単な説明

• ifconfigを使用すると、ネットワーク上の情報を含むテキストのブロブを取得できます。
• そのblobの中に、私のローカルIPを持つこのテキストがあります： inet 192.168.0.18 。
• その部分を見つけるために、テキストのブロブ全体をawkにパイプし、RegExを使用してinet 192.168.x.yを見つけます（ここで、 xとyは任意のものに置き換えることができます0から999までの番号）そしてIPを印刷します。
• そのIPは、 gatsby developスクリプト呼び出しの--hostに使用されます。

コマンドラインで直接使用する

package.json使用されるコマンドには、JS / JSONのバックスラッシュのエスケープ文字機能を回避するためのダブルバックスラッシュがあります（詳細）。 つまり、コマンドラインでこのコードを試してみたい場合は、次を使用してください。

gatsby develop --host $(ifconfig | awk '/inet 192\.168\.[0-9]+\.[0-9]+/{print $2}') --port 8000

コマンドラインで試して、ニーズに合わせて変更する場合、 package.json scriptsで使用する場合は、必ず

何かが変わったに違いないようです！ 私にとってちょっとうまくいくのはgatsby develop -H 0.0.0.0だけですが、デバイスにHMRがありません。
残りを試しましたが、ローカルマシンまたは電話でまったく接続されません。

編集：このコンピューターにlaravel valetがインストールされていることに気付いたので、これが機能しないのかもしれません。 gatsby develop --host $(hostname)ほぼ機能するようにできましたが、これはローカルでのみ機能し、ネットワークでは機能しません。

$HOSTNAMEが私のマシンにほとんど設定されていません。 だから私はこれが必要です、そしてそれは私のローカルネットワークデバイス全体で完璧に動作します：

gatsby develop -H $(hostname) -p 8000

これが今の私のデフォルトではコマンドセットを開発しているpackage.jsonとして実行yarn develop 。 すごい！

これはhttps://github.com/gatsbyjs/gatsby/pull/11227で修正する必要があり

いいね！ では、別のデバイスから開発サイトを表示するための推奨される方法は何ですか？ それはgatsby develop -H $(hostname) -p 8000ですか、それとも別の方法がありますか？

@TylerBarnes gatsby develop -H 0.0.0.0を実行し、ネットワーク上の別のデバイスで<IP>:8000でマシンを開くことができるはずです。

素晴らしい、ありがとう@sidharthachatterjee！

ウィンドウズ：
cmdの場合
for / f "tokens = 4"％i in（ 'route print ^ | find "0.0.0.0"'）do gatsby development --host％i
構成で「を」に変更します
for / f "tokens = 4"％i in（ 'route print ^ | find "0.0.0.0"'）do gatsby development --host％i

Linux：
gatsby development --host $（route -n | grep ^ 0.0.0.0 | awk '{print $ 2}'）

macOSでは、ファイル共有も有効にする必要があると思います（ System Preferences -> Sharing ）。

また、 Computer NameフィールドをURLで使用できます。 たとえば、私のコンピューター名はkyoto 、 http://kyoto.local:8000介して（同じネットワーク上で）リモートで開発サイトにアクセスできます。

gatsby develop -H 0.0.0.0は正常に機能しています🎉

--openオプションでこれを機能させる方法を知っている人http://0.0.0.0:8000/を開くURLは実際には機能しません。 手動でlocalhost：8000に移動できますが、移動し

編集：ドキュメントから

注：Windowsでは0.0.0.0:8000にアクセスできません（ただし、localhost：8000またはWindowsの「OnYourNetwork」URLのいずれかを使用して機能します）

ケースが処理されないのは奇妙に思えます

@crhistianramirezそのエッジケースは、残念ながらWindowsの問題です（一部のテスト中に表面化したため、ドキュメントにメモを追加しました）😞

こんにちは、

package.jsonファイルにgatsby develop -H 0.0.0.0を追加するにはどうすればよいですか？ このようなスクリプトに入れようとしましたが、機能しません。

"scripts": {
  "build": "gatsby build",
  "develop": "gatsby develop -H 0.0.0.0",
  "format": "prettier --write \"**/*.{js,jsx,json,md}\"",
  "start": "npm run develop",
  "serve": "gatsby serve",
  "clean": "gatsby clean",
  "test": "echo \"Write tests! -> https://gatsby.dev/unit-testing\" && exit 1"
}

@iloveipそれは大丈夫に見えます。 npm run developますか？ もしそうなら、多分gatsby develop -H 0.0.0.0は何らかの理由であなたのマシンで動作しません。

@nikoladev私は単にgatsby develop実行していました🙈助けてくれてありがとう！

同じ問題がありましたが、ブラウザのようでした。 私はもともとFirefoxを使用していましたが、MicrosoftEdgeでは正常に動作しているようです

誰かがnginxで：8000をリバースプロキシしようとしましたか？ あなたの意見ではうまくいくでしょうか？