CD
Cloudflare Developers•2mo ago
Nemanja02

Svelte Kit Deployment

Hello, I am trying to deploy my svelte kit app to cloudflare worker. Application is working fine locally, but when I deploy it on cloudflare it gives error 500. Wrangler tail doesn't show anything and I cannot find what is the error. This is my svelte config 
import adapter from '@sveltejs/adapter-cloudflare';
import { vitePreprocess } from '@sveltejs/vite-plugin-svelte';

export default {
    preprocess: vitePreprocess(),
    kit: {
        adapter: adapter(),
    }
};
import adapter from '@sveltejs/adapter-cloudflare';
import { vitePreprocess } from '@sveltejs/vite-plugin-svelte';

export default {
    preprocess: vitePreprocess(),
    kit: {
        adapter: adapter(),
    }
};
No description
1 Reply
ChadK
ChadK•2mo ago
I have a SvelteKit app deployed to Cloudflare Pages not Cloudflare Workers, but here are a few places to start: 1) I recall having to be explicit about routes in svelte.config.js. Note the routes object in the docs: https://svelte.dev/docs/kit/adapter-cloudflare#Usage 2) Since this is working locally but not on CF, I'd recommend using hooks.server.ts to try to get to the heart of the issue, e.g. 
export const handleError: HandleServerError = async ({ error }) => {
  // Capture "window is undefined" errors likely caused by a SSR-generated component using a browser API, e.g. Chart.js
  if (error instanceof ReferenceError && error.message === 'window is not defined') {
    console.error('Window Reference Error:', error.stack);
 }
  // Capture all other errors
  if (error) {
    console.log(error);
 }
  return {
    message: 'Internal Server Error',
 };
};
export const handleError: HandleServerError = async ({ error }) => {
  // Capture "window is undefined" errors likely caused by a SSR-generated component using a browser API, e.g. Chart.js
  if (error instanceof ReferenceError && error.message === 'window is not defined') {
    console.error('Window Reference Error:', error.stack);
 }
  // Capture all other errors
  if (error) {
    console.log(error);
 }
  return {
    message: 'Internal Server Error',
 };
};
3) Keep in mind the Worker environment is not a full Node environment and has size limits. 4) This is unlikely to be your error since it works locally, but one thing that tripped me up early on was NOT wrapping third party scripts in an onMount. SvelteKit is SSR happy which is great, but just remember anything looking for a browser API on the server will throw a 500 error. Good luck!
Cloudflare Pages • Docs • Svelte
Cloudflare Pages • Svelte documentation

Did you find this page helpful?