CODEWITHSUNDEEP
astrojs
bumpyroad44
bumpyroad44

Reputation: 105

Can't connect to Astro dev server on other device

I am using npm run dev -- --host command in the terminal while working with a project in Astro.

It gives me local and network link addresses to connect:

Local    http://localhost:4321/
Network  http://192.168.1.12:4321/

Although I can connect to both of these addresses on my PC, I can't connect to the http://192.168.1.12:4321/ on my mobile phone to use it as a mobile view during development. The phone is running iOS 17.1.2 and is connected to the local network and has the local IP address.

Do you have any idea what can be the problem?

Upvotes: 5

Views: 3792

Answers (2)

Kyriazis
Kyriazis

Reputation: 321

In package.json of your astro project under "scripts" modify the "dev" command to be "astro dev --host" instead of just "astro dev". Then when you run the dev server it will be available to your local network. See below for what package.json scripts section should look like:

"scripts": {
    "dev": "astro dev --host",
    "start": "astro dev",
    "build": "astro build",
    "preview": "astro preview",
    "astro": "astro"
}

Then start the dev server with:

npm run dev

And the output should be something like this:

🚀  astro  v3.4.4 started in 199ms

┃ Local    http://localhost:4321/
┃ Network  http://192.168.1.132:4321/

Upvotes: 13

Martin Trapp
Martin Trapp

Reputation: 101

See How can I access my localhost from my Android device? to find out how you can access your local deployment from your phone in the same network (also works for the iPhone).

Since Astro 4, there is an alternative and very convenient way of accessing a local Astro DEV server from the Internet:

npx astro add astro-tunnel

From https://github.com/morinokami/astro-tunnel#astro-tunnel:

Astro Tunnel is an Astro Dev Toolbar App that enables your local Astro server to be accessible from the internet. Internally, it uses Cloudflare's Quick Tunnels via unjs/untun, so no additional configuration is required to start tunneling.

Upvotes: 1

Related Questions