Sveltekit deployment doesn't seem to work

Support
1

My netlify site name: mellifluous-cranachan-5857d5.netlify.app

Build problems? Link or paste the FULL build log & build settings screenshot

My basic SvelteKit deployment does not work.

Once deployed Netlify, I go to my url and just get a 404 page:

Screenshot 2022-12-15 at 1.13.24 PM
Screenshot 2022-12-15 at 1.13.24 PM978×730 49.5 KB

SvelteKit claims to have a supported adapter-netlify that automatically creates and configures a Netlify app. But nothing I have tried so far works.

What I’ve done so far:
All I did was follow the “see for yourself” instructions at https://kit.svelte.dev/ to create a basic SvelteKit Demo site, and pushed it to GitHub.
Without editing the code I connected my GitHub account and let Netlify auto-detect the right config.

The site “deployed” successfully but there was no page to be found. (see above screenshot)

SO THEN:

I added the followed the instructions at SvelteKit on Netlify | Netlify Docs
added the @sveltejs/adapter-netlify package, configured it in the svelte.config.js

import adapter from '@sveltejs/adapter-netlify';
import { vitePreprocess } from '@sveltejs/kit/vite';

/** @type {import('@sveltejs/kit').Config} */
const config = {
	// Consult https://kit.svelte.dev/docs/integrations#preprocessors
	// for more information about preprocessors
	preprocess: vitePreprocess(),

	kit: {
		adapter: adapter()
	}
};

export default config;

deployed and… Page Not Found. (See above screenshot)

SO THEN:

I tried using the netlify-cli, ran netlify dev in the root, and low and behold the page rendered on port 8888 :tada:

BUT… The Sverdle example page still failed on an API request to http://localhost:8888/sverdle?/enter but it was still better than the deployed site was doing.

SO THEN:
I noticed it was building a .netlify directory, so I went into my Deploy Settings > Build settings and changed the Publish directory from .svelte-kit to .netlify, triggered a new deploy, and though it seemed to deploy with no errors I still saw: Page Not Found (see screenshot above)

It’s possible I’ve done something wrong, if so let me know, but I am concerned with the SvelteKit 1.0 release that many others will be trying SvelteKit on Netlify, having a similar experience to mine, and just going somewhere else instead.

My netlify site name: mellifluous-cranachan-5857d5.netlify.app
My GitHub Repo: GitHub - BigAB/testing-netlify: This is just to test SvelteKits netlify adapter

Let me know if you have any thoughts.

2

Hey ,

Can you please try adding an index.html file in the root of the repo? this may help, as it is often necessary to create the site.

More info: [Support Guide] I’ve deployed my site but I still see "Page not found” - #16 by lowi307

3

I have the same issue with my first sveltekit 1.0 app. Works in dev and preview but netlify can’t run it.

  • I tried putting index.html in the root of the repo, but that doesn’t help.
  • I also tried putting it in the /src/static directory (which put the file in .svelte-kit/output/client), because the thread you linked mentions a “deploy directory”, but no luck either. I don’t think svelte has a deploy directory, the server makes it all up as it goes.

ETA:I’m using sveltekit’s adapter-auto which claims to delegate to adapter-netlify automatically

4

To the root of my repo?

Okay… add index.html to root of project · BigAB/testing-netlify@2d05354 · GitHub

It didn’t work

5

index.html is not required. The Svelte Adapter is supposed to add a redirect so that it can work on Netlify. In your deploy, it’s not doing that. Why? That’s a question Svelte can answer better than us.

I can see, in their code, they have the config to add the redirect:

You should open as issue with them to get to the root cause of this. But to solve the issue, you can simply add a netlify.toml with the contents:

[[redirects]]
  from = "/*"
  status = 200
  to = "/.netlify/functions/render"
7

Ok, added tht netlify.toml to the root of my project.

Getting closer…

Screenshot 2022-12-23 at 9.00.59 AM
Screenshot 2022-12-23 at 9.00.59 AM2308×1062 410 KB

At least now it is consistent between netlify dev and the deployed environment

8

I tried your repo locally, and the problem is not because of the redirect file. You can remove that. As it turns out, the default publish path for svelte-kit is being set as .svelte-kit, but it should be build. Make sure you go to site settings → build and deploy → set publish path to build. You can remove the netlify.toml.

1 Like
9

Oh man, I can’t believe it was that simple.

All this time lost. Thanks so much.