Now I see that in the current version of the template your solution should work, but my template was generated by the shopify cli, so it uses this template. Which overrides the PORT with the BACKEND_PORT if it’s set.
Topic summary
Goal: fix the development environment to use a static localhost port (e.g., 3000) for a Node.js Shopify app built from the Shopify CLI template using Vite.
What was tried:
- Setting PORT=3000 in .env and adding PORT=3000 to the dev script via cross-env (nodemon server/index.js). This pins the Express backend to 3000.
- Using BACKEND_PORT and FRONTEND_PORT variables. In the CLI-based template (cli_three branch), PORT is overridden by BACKEND_PORT, but setting both BACKEND_PORT=3000 and FRONTEND_PORT=3000 did not make Vite use 3000.
Key details:
- The template’s behavior differs from the main repo; it overrides PORT with BACKEND_PORT if present.
- Vite still serves on a random port even when the backend (Express) is fixed to 3000.
- A code snippet was provided showing the dev script with cross-env setting PORT.
Latest note:
- README for the cli_three template suggests setting up Cloudflare, implying the dev tunnel/ports may be managed externally.
Status:
- No confirmed solution to force Vite’s dev server to a static port in this template. The issue remains open; guidance may hinge on Cloudflare/tunnel configuration.