Articles on: Websites & APIs

How to host Qwik applications

How to Host Qwik Applications on Square Cloud


Qwik rebuilds the browser user experience without the burden of initial JavaScript. To host your Qwik application (generated via Qwik City in static mode) on Square Cloud, the process consists of building the project and serving it through the serve library on the platform's mandatory port.



1. Running the Production Build


First of all, we need to generate the optimized files that will be delivered to clients. At the root of your local project, run the compilation command:


npm run build


This command will process your components and generate the dist/ folder at the root of your project. It is inside this directory that all structured HTML files and the small code fragments ready for resumability reside.



3. Adjusting Port 80 and the Startup Command


Square Cloud uses port 80 to route traffic. Configure your start command (either in the Dashboard or in the squarecloud.app configuration file) to point the server to the build folder using the correct parameters.


Start Command:

npx serve -s dist -p 80


  • -s (Single Page Application): Ensures that Qwik City's file-based routing works perfectly, redirecting internal route requests to the main file and avoiding 404 errors when refreshing the page.
  • dist: Indicates the target folder containing the compiled files.
  • -p 80: Sets the mandatory listening port for the Square Cloud environment.



4. What to Include in the .zip File?


To achieve a clean and agile deployment, compress only the files required for production execution:


  • The complete dist/ folder.
  • The package.json file.
  • The package-lock.json or yarn.lock file.


Reminder: Leave the node_modules and src folders out of the .zip file. Square Cloud will handle installing dependencies cleanly on the server as soon as the upload is complete.



5. Qwik with SSR (Optional)


If instead of generating a static site you are using Qwik City with an SSR adapter (such as the Node.js adapter), the structure changes slightly:

  1. The build will generate a server folder (usually server/).
  2. The start command will become the execution of the server's entry file (e.g., node server/entry.mjs).

```

Updated on: 05/25/2026

Was this article helpful?

Share your feedback

Cancel

Thank you!