Deploy a React app (Vite)

Prerequisites

• A React project built with Vite (Create React App works too; its output folder is build).
• A build script (vite build or tsc -b && vite build) and a committed lockfile.
• A backend you can reach over HTTPS if the app calls an API.

How Deployxa detects React

A react dependency with a vite.config.* file selects the React preset. Nothing runs at request time; the build output is served as static files.

Required config

SPA routing

Unknown paths fall back to index.html, so React Router (or TanStack Router) deep links such as /settings/billing work without extra config. Keep base at its default / in vite.config.ts unless the app lives under a sub-path:

// vite.config.ts
import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';

export default defineConfig({
  plugins: [react()],
  base: '/',            // assets resolve from the site root on deep links
  build: { outDir: 'dist' },
});

Build-time environment variables

Vite only exposes variables prefixed with VITE_, and inlines them at build time:

const api = import.meta.env.VITE_API_URL;
const res = await fetch(`${api}/projects`);

Databases

A static SPA cannot hold database credentials. Put data access behind an API (for example an Express or FastAPI service on Deployxa with a managed PostgreSQL database) or use a client-safe backend such as Supabase with row-level security. Allow the SPA's domain in the API's CORS settings.

Deploy

From the dashboard

1. 1
   Source

   Open Dashboard → Projects → New project (/dashboard/projects/new). Pick the GitHub repository and branch, or upload a .zip archive of the project.

2. 2
   Configure

   Leave the framework preset on Auto-detect or choose React (Vite/CRA). Check the fields under advanced settings:

   • Build command: npm run build
   • Output directory: dist
   • Root directory: ./, or the sub-folder that holds the app in a monorepo
   • Database: None
3. 3
   Environment

   Add the VITE_* variables here so they exist when the build runs.

4. 4
   Deploy

   Start the deploy and watch the build log. When the release passes its health check it is served over HTTPS on its Deployxa URL.

From the CLI

$ npm install -g @deployxa/cli
$ deployxa login
$ cd my-app
$ deployxa link            # pick an existing project, or skip: deploy creates one
$ deployxa env set VITE_API_URL "https://api.example.com"
$ deployxa deploy
$ deployxa logs --live     # stream build and runtime logs
$ deployxa open            # open the live URL

If the folder is not linked, deployxa deploy creates a project named after the folder and links it (the link is saved in .deployxa/config.json). Later runs deploy the linked project. deployxa status shows the latest deployment and deployxa rollback previous returns to the release before it.

Custom domain

Go to Dashboard → Domains, choose Connect a domain you already own and pick this project. Deployxa then shows the DNS records to create at your DNS provider:

DNS changes can take several minutes to propagate; use Retry verification once they have. A Let's Encrypt certificate is issued after the domain verifies. From a linked folder you can do the same with the CLI:

$ deployxa domains add app.example.com
$ deployxa dns             # Waiting → Verified → SSL Active
$ deployxa domains list

Common errors and fixes

Start with deployxa logs --live (or the deployment's log view in the dashboard): the build log shows dependency and compile failures, the runtime log shows crashes and bind errors. See also Troubleshooting.