Deployment

BuildCopy Anchor Link

npm run build

Vite writes the app to dist/: index.html, the JavaScript and CSS in assets/ (with hashed file names) and the files from public/. It needs no Node.js server. Check the build locally with npm run preview at http://localhost:4173.

Static hosting with a fallbackCopy Anchor Link

AdminKit for React is a single-page app: dist/ has one HTML file, and React Router renders the page for the URL in the browser. Links inside the app work on any host, but opening or reloading /pages-settings asks the host for a file that does not exist. Configure the host to serve the files that exist and index.html for every other path. Paths that are no page of the app then show the app's 404 page.

VercelCopy Anchor Link

{
  "framework": null,
  "buildCommand": "npm run build",
  "outputDirectory": "dist",
  "rewrites": [{ "source": "/(.*)", "destination": "/index.html" }]
}

Vercel serves the files in dist/ first and rewrites everything else to index.html.

NetlifyCopy Anchor Link

Set the build command to npm run build and the publish directory to dist, and add a _redirects file to public/, which Vite copies into dist/:

/*  /index.html  200

Or in netlify.toml:

[build]
  command = "npm run build"
  publish = "dist"

[[redirects]]
  from = "/*"
  to = "/index.html"
  status = 200

nginxCopy Anchor Link

server {
  root /var/www/adminkit/dist;

  location / {
    try_files $uri $uri/ /index.html;
  }
}

Other hosts (Cloudflare Pages, Apache, an S3 bucket behind a CDN) work the same way: serve dist/, and index.html for paths without a file.

Base pathCopy Anchor Link

To serve the app from a sub-path such as https://example.com/admin/, set BASE_PATH when you build:

BASE_PATH=/admin npm run build

Or put BASE_PATH=/admin in a .env file (see .env.example), or in the build settings of your host. The asset URLs, React Router's links (its basename) and images written with asset() get the prefix. Upload dist/ to the /admin/ folder and point the fallback at /admin/index.html, for example in nginx:

location /admin/ {
  try_files $uri $uri/ /admin/index.html;
}