Issue with NagariaHussain/doppio App Setup

,
1

I am trying out the amazing NagariaHussain/doppio app, but I can’t get it to work. Am I missing any steps? Below are the details:

Pre-requisites:

  1. I have a custom app named restaurant_pos
  2. I created a site named test.localhost, installed the custom app, and set up dns multitenant
  3. I can do development and access the site via test.localhost:8000
  4. I am using docker with 3 services: mariadb, redis and frappe
  5. the frappe service is configured as follows:
frappe:
    build: .
    command: sleep infinity
    environment:
      - SHELL=/bin/bash
    volumes:
      - bench:/home/frappe/frappe-bench
      - apps:/home/frappe/frappe-bench/apps:rw
      - sites:/home/frappe/frappe-bench/sites:rw
    ports:
      - 8000-8005:8000-8005
      - 9000-9005:9000-9005
      - 8080:8080
    extra_hosts:
      - "test.localhost:127.0.0.1"
  1. I am using Windows 11

Steps I Followed:

  1. bench get-app https://github.com/NagariaHussain/doppio
  2. bench add-frappe-ui
  3. Verified that frontend folder is created inside the restaurant_pos app with Vue project setup.
  4. Started the server using bench start
  5. In another terminal, cd apps/restaurant_pos/frontend and run yarn and yarn dev
  6. The terminal shows that the Vite dev server is running at http://localhost:8080/
  7. Tried accessing test.localhost:8080, test.localhost:8080/frontend, localhost:8080, localhost:8080/frontend but the browser showing “This page isn’t working” indicate that page is not up.

Am I missing something here? Any help would be appreciated!

2

Solution Found:

After cross-checking with the standard Frappe/HRMS app, I noticed that it uses vite dev --host instead of just vite for the dev command. I applied the same change to my custom app (restaurant_pos), and it works now!

I wonder why it works, so I asked GPT, below is the answer:

Why This Fix Worked:

By default, when you run vite dev, the development server binds to localhost (i.e., 127.0.0.1). This means it’s only accessible from the local machine. However, in a Docker environment, services need to communicate over the network, and binding to localhost restricts access from outside the container.

When you add the --host flag (vite dev --host), it makes Vite bind to all available network interfaces (0.0.0.0), allowing access from other containers and services, including the host machine. This is crucial in Docker setups where multiple services need to interact.

Key Takeaways:

  • The default vite command restricts access to localhost.
  • Using vite dev --host makes the server accessible to other services within Docker and from your host machine by listening on all interfaces (0.0.0.0).
1 Like