How to detect that is Gatsby serving the build output?

Question

I would like to know if it is possible and how to detect if the code running is gatsby's build output served by gatsby serve. When I launch gatsby serve the browser opens on localhost:9000/, I would need to change code based on some kind of environment variable or another way. I am looking for the most idiomatic way to do it, if possible not some hack like reading the window.location object if possible. Thanks in advance

Answer 1

When you gatsby build, Gatsby creates a production ready build of your project in the public folder of your project. That means that you can take the public folder and deploy the code to a http server. You cannot "detect" any special properties from this code. gatsby build is gatsby build.

The only way I see is detecting the use of the standard gatsby serve port number :9000 when you gatsby serve. See the Mozilla docs.

You can get location props from the reach/router API that Gatsby implements. I am not sure if it implements the same methods as mentioned in the Mozilla documentation. You should try this.

const index = ({ location }) => {

  console.log(location.port);

  // ...
}

As an alternative you can parse the URL string as described in this answer.