Skip to content

Instantly share code, notes, and snippets.

Last active June 27, 2024 21:52
Show Gist options
  • Save 0gust1/1fc3c461ace390df556b2231b7284e70 to your computer and use it in GitHub Desktop.
Save 0gust1/1fc3c461ace390df556b2231b7284e70 to your computer and use it in GitHub Desktop.
Deploy SvelteKit on Azure App Service

Deploy a SvelteKit app (with server-side code) on Azure App service.

Here we want to deploy a SvelteKit app, which has server-side code or do Server-Side Rendering (SSR) (data endpoints, load function in components).

For a SvelteKit app which is a pure browser-only SPA or a static website, with no server-side code (as one generated with adapter-static): you don't need an Azure app service instance, an Azure storage blob container ($web) is all you need.

In theory, a Sveltekit app with a server-side should be deployable on the new "Azure Static Webapps" product, but we still need to have a dedicated adapter converting the server code to something compatible with Azure functions.

Manage your dependencies

Unlike a lot of nodeJS/JS projects, when working with SvelteKit you should pay attention to the difference between devDependencies and dependencies. In your dependencies, you should have everything you need to run your app, browser-side and server-side as well : e.g database libraries, preprocess functions, etc.

Use node-adapter

Right now, do a npm i @sveltejs/adapter-node@next -D (adapters are not completly stable), and refer to the adapters doc and adapter-node doc

Upload the whole project folder to Kudu / App Service

Due to the way a SvelteKit project is structured, you'll need to upload your whole project to Kudu (the deployment engine behind Azure App Service). Upon upload, Kudu will do an npm install and npm run build.

Adjust the launch script

In your Azure app configuration, adjust the "startup command" to node /home/site/wwwroot/build/.
You'll find this in Azure Portal, under the "Configuration" pane, in "General settings" tab.
It can also be set using azure CLI:

az webapp config set --startup-file "node /home/site/wwwroot/build/"  -g <resource-group-name> -n <webapp-name>

If you changed the config of adapter-node to output the generated app in another folder, replace build/ by your chosen directory.

(to be enriched / continued)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment