Deploy Error Health Checks - Why will this Vite App will not deploy?

Question

Deploy Error: Health Checks Vite App failes to deploy

Hello- Currently recieving an error when attempting to deploy a svelte vite app. Does anyone know what is needed to be altered to correct the error described below?

The code builds & runs successfully locally. When in the app it is set up to deploy from a github repo. The code builds successfully & then in the “Deploy logs” this is the error:


appname@1.0.0 preview

vite preview 0.0.0.0

Local:   [http://localhost:4173/](http://localhost:4173/)

Network: use --host to expose

The package.json file looks like this:

    "scripts": {
        "dev": "vite dev",
        "start": "vite dev",
        "build": "vite build",
        "prod": "vite dev -- --host 0.0.0.0 --port 8080",
        "preview": "vite preview",
        "test": "npm run test:integration && npm run test:unit",
        "check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
        "check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
        "lint": "prettier --check . && eslint .",
        "format": "prettier --write .",
        "test:integration": "playwright test",
        "test:unit": "vitest",
        "postbuild": "node --experimental-json-modules ./generate-sitemap.js"
    },

What needs to be altered to have a successful deployment?

Bobby · Answer

Hey Chris,

From your deployment logs, it appears that your application is trying to run in development mode (vite dev) on the server. This is typically not ideal for production deployments.

The development server is optimized for speed and live reloading, not for performance and security, which are crucial in a production environment.

The best practice here would be to build your app and deploy it as a static site. This way, you leverage the full optimization that Vite offers for production. Here’s how you can adjust your package.json scripts for a more suitable deployment process:

Your existing "build": "vite build" script is good for compiling and preparing the app for production. Make sure it runs successfully.
The "preview": "vite preview" is meant for previewing the build locally and might not be suitable for production. It’s better to serve the static files generated by the build process.
Instead of using vite dev for the start or prod script in production, you should serve the static files generated in the dist directory (or whichever directory Vite outputs to). You can use a static file server like serve for this. For instance, you could have a script like "start": "serve dist -l 8080".
Also, check if your app requires any environment variables that are present in your local environment but missing in the App Platform configuration.
Ensure that your application binds to the correct host and port. In many cloud platforms, the port is usually set by an environment variable (like PORT), so your application needs to listen on this port.

Here is a sample Vite app that you could use as a reference:

https://github.com/digitalocean/sample-vite-react/blob/main/package.json

    "start": "node sammy.js; serve -s _static -l tcp://0.0.0.0:$PORT -n",

Let me know how it goes! And good luck with your deployment!

Best,

Bobby

Report this

Deploy Error Health Checks - Why will this Vite App will not deploy?

Deploy Error: Health Checks Vite App failes to deploy

Become a contributor for community

DigitalOcean Documentation

Resources for startups and AI-native businesses

The developer cloud

Start building today