Skip to main content
Icon

SvelteKit

Learn how to deploy your SvelteKit project to your own cloud infrastructure with OwnStak.

Prerequisites

  • An OwnStak account with a fully set up organization
  • A SvelteKit project (version 2.0.0 or higher)
  • Node.js installed locally (version 18.x or higher)

Getting Started

1. Prepare your SvelteKit project

Create a new SvelteKit project by running:

npx sv create my-sveltekit-app

Once the wizard finishes, enter the project directory and install all dependencies:

cd my-sveltekit-app
npm install
note

For existing projects, remove any platform-specific adapters (such as @sveltejs/adapter-netlify, @sveltejs/adapter-cloudflare...) and change it to @sveltejs/adapter-node or use the default @sveltejs/adapter-auto adapter.

2. Deploy from your machine

Now, you can deploy the project from your machine by running:

npx ownstak deploy

When you run the deploy command for the first time, the CLI will detect the currently used framework and guide you through the login and project configuration setup. Simply follow the instructions:

OwnStak deploy login prompt OwnStak deploy config setup

The organization and project names are stored in the ownstak.config.js configuration file for subsequent deployments, so you won't be prompted for this information again.

OwnStak deploy build step OwnStak deploy build step

3. Deploy from CI

For CI and other non-persistent environments, you can skip the interactive deployment by providing the API key and other required options as command arguments. You can generate a new API key for your account or project in the OwnStak Console under Settings > API Keys.

npx ownstak deploy --api-key=<your-secret-key> --organization=ownstak --project=my-sveltekit-app --environment=default

4. Done!

Your project is now live and deployed to your organization's cloud infrastructure. You can visit and test it using the environment and deployment links provided in the output:

  • Environment link – Always points to the latest deployment in a given project environment Example: my-sveltekit-app-development.aws-primary.my-org.ownstak.link
  • Deployment link – Always points to a specific deployment Example: my-sveltekit-app-development-10.aws-primary.my-org.ownstak.link

Local testing

If your project doesn't behave as expected, you can build and test it locally before deploying.

1. Build the project

Run the following command in your project directory to build your project without deploying it:

npx ownstak build

2. Start the project

Start the project and make sure it works for you locally with OwnStak:

npx ownstak start

When you see the ready message, you can visit http://localhost:3000 to test your application.

Caching

OwnStak by default sets different cache-control headers for assets, permanent assets, and pre-rendered pages with reasonable time for your CDN for the best performance. It's expected to do cache purge via Webhooks after every deployment. See CDN Configuration. Default cache-control headers can be overridden.

Headers

Custom HTTP headers can be dynamically set from SSR pages, or you can define static headers in your ownstak.config.js file.

import { Config } from 'ownstak'

export default new Config()
// Apply headers to specific paths
.setResponseHeaders({ "Cache-Control": "public, max-age=31536000" }, "/assets/:path*")
// Apply headers to all paths
.setResponseHeaders({
"X-Frame-Options": "DENY",
"X-Content-Type-Options": "nosniff",
"Cache-Control": "public, max-age=31536000"
})

Redirects

Custom redirects can be dynamically set from SSR pages, or you can define static redirects in your ownstak.config.js file.

import { Config } from 'ownstak'

export default new Config()
.setRedirect('/old-page', '/new-page')
.setRedirect('/api/:path*', '/new-api/:path*', 301)

Supported features

Here's a list of the features supported by OwnStak for SvelteKit:

Feature
Support
Server-Side Rendering (SSR)
supported
Server-side rendering of pages using SvelteKit's SSR mode. See SvelteKit Server-side rendering.
Static Site Generation (SSG)
supported
Support for static pre-rendering of pages using SvelteKit's prerender option. See SvelteKit Prerendering.
Client-Side Rendering (SPA)
supported
Client-side rendering of pages by disabling SSR in SvelteKit configuration. See SvelteKit Client-Side Rendering.
API Routes
supported
Response streaming
supported
OwnStak supports end-to-end HTTP streaming from all server-side rendered pages for faster TTFB. This feature requires enabling app streaming.
Node.js runtime
supported
Edge runtime
not supported