svelte-ssr-cloudflare-worker-site

A server-side rendered Svelte application built as a Cloudflare Worker Site

Overview

This project is an example of how to set up a server-side rendered, single-page application using Svelte and Cloudflare Workers Sites. The svelte-loader Webpack loader is used given native support of Webpack by Wrangler, the official CLI for managing Workers Sites. Wrangler automates the process of pushing static assets to Workers KV so you can focus on your application code. The result is a high performance server-side rendered Svelte application deployed globally!

Live demo here and here.

Heavily inspired by lukeed/svelte-ssr-worker.

Install

Get started by cloning a copy of the template and running a local dev server.

npx degit wtcross/svelte-ssr-cloudflare-worker-site svelte-ssr-example
cd svelte-ssr-example
npm install
npm run dev

It is strongly recommended to reference the following docs before building anything beyond a basic demo:

• Cloudflare Worker Docs
• Wrangler Docs

Usage

npm run build

Build the client, ssr, and worker components.

npm run publish

Build everything and publish the Workers Site using Wrangler.

npm run dev

Start a Webpack DevServer for local development.

npm run prettier

Use Prettier to format everything.

Deploy

If you want to publish a Workers Site to your Cloudflare account you need to:

• Set the account_id property in wrangler.toml to your Cloudflare account ID
• Configure Wrangler with the wrangler config command

Now you can run npm run publish to publish the application.

License

MIT © Tyler Cross