Host situs SvelteKit statis dengan adapter-static

Q: Adapter SvelteKit mana yang harus saya pakai untuk Lobsite?

@sveltejs/adapter-static, dengan setiap halaman di-prerender. adapter-auto dan adapter platform membuat untuk server dan fungsi, yang tidak dijalankan Lobsite.

Q: Bisakah SPA SvelteKit dengan halaman fallback berjalan di sini?

Ya. Setel adapter({ fallback: "200.html" }): Lobsite menyajikan 200.html dengan status 200 untuk setiap path yang bukan file, dan router SvelteKit merender halaman di browser. Halaman yang di-prerender tetap disajikan apa adanya.

SvelteKit dapat me-prerender setiap halaman saat build dan menulis hasilnya sebagai file biasa dengan @sveltejs/adapter-static. Lobsite meng-host file tersebut. Build dengan adapter statis, jalankan npx lobsite, dan situs aktif di alamat *.lobsite.app dengan HTTPS. Halaman ini membahas situs yang sepenuhnya di-prerender. Rute server dan form action memerlukan host yang menjalankan SvelteKit di server.

Cara kerjanya

Beralih ke adapter statis dan prerender setiap halaman (lihat di bawah), lalu jalankan npm run build. Situs masuk ke build/.
Jalankan npx lobsite di proyek. Perintah ini melakukan deploy build/, bukan static/ atau .svelte-kit/. Deploy pertama tidak memerlukan akun dan bertahan 6 jam.
Simpan dengan tautan klaim, di akun gratis. Setelah itu, npm run build && npx lobsite memperbarui alamat yang sama.

adapter-static dan prerendering

// svelte.config.js
import adapter from "@sveltejs/adapter-static";

export default {
  kit: { adapter: adapter() },
};

// src/routes/+layout.js
export const prerender = true;

prerender = true di layout root membuat setiap halaman dirender saat build. Jika halaman tidak dapat di-prerender, build gagal dan menyebutkan halamannya, sehingga tidak ada yang rusak yang di-deploy.
fallback: "200.html" untuk halaman yang tidak dapat di-prerender: SvelteKit menulis shell 200.html, dan Lobsite menyajikannya untuk path apa pun yang bukan file, sehingga halaman itu dirender di browser. Halaman yang di-prerender tetap lebih baik untuk mesin pencari dan pemuatan pertama.
trailingSlash dapat tetap pada bawaannya: /about ditulis sebagai about.html dan disajikan di /about.

Yang berjalan saat build, dan yang tidak bisa

Fungsi load, termasuk yang ada di +page.server.js, berjalan selama build saat halaman di-prerender, sehingga data dari file atau API tertanam di HTML. Rute dinamis ditemukan dengan mengikuti tautan dari halaman Anda; cantumkan yang tidak ditautkan di prerender.entries. Yang tidak dapat berfungsi tanpa server: form action, endpoint +server.js selain GET yang di-prerender, hook yang berjalan per permintaan, dan membaca cookie. Untuk formulir kontak, kirim ke /_lobsite/forms/contact, bukan form action; lihat formulir.

Hanya file yang berubah yang diunggah

File disimpan berdasarkan hash-nya. Deploy ulang situs yang tidak berubah mengunggah 0 byte.

Setiap deploy mendapat URL

Pratinjau sebelum tayang. Rollback dengan satu klik, termasuk pengalihan.

HTTPS di mana-mana

Setiap situs mendapat alamat *.lobsite.app dengan HTTPS sejak deploy pertama.

Formulir yang langsung berfungsi

Arahkan formulir ke /_lobsite/forms/contact. Termasuk penyaringan spam.

Konfigurasi dalam satu file

Pengalihan, header, dan formulir ada di lobsite.toml dan ikut bersama setiap deploy.

Batas yang dapat Anda baca

Setiap batas dipublikasikan, dan setiap error memberi tahu langkah selanjutnya.

Perbandingan host SvelteKit

	Lobsite	Vercel	Netlify	Cloudflare Pages
Situs prerender (`adapter-static`)	Ya	Ya	Ya	Ya
Render server, form action	Tidak	Ya	Ya	Ya
Build di server	Tidak: Anda deploy `build/`	Ya	Ya	Ya
Akun sebelum deploy pertama	Tidak: aktif 6 jam, lalu simpan gratis	Ya	Ya	Ya
Formulir tanpa backend	Ya, setelah situs ada di akun	Tidak	Ya	Tidak
Domain kustom	Ya, gratis	Ya	Ya	Ya

Jika aplikasi Anda merender halaman saat diminta, gunakan adapter untuk host yang menjalankannya. Jika setiap halaman dapat di-prerender, seperti situs pemasaran, blog, dan dokumentasi, Lobsite meng-host-nya dengan satu perintah dan hanya mengunggah file yang diubah setiap build.

Pertanyaan umum

Adapter SvelteKit mana yang harus saya pakai untuk Lobsite?

@sveltejs/adapter-static, dengan setiap halaman di-prerender. adapter-auto dan adapter platform membuat untuk server dan fungsi, yang tidak dijalankan Lobsite.

Bisakah SPA SvelteKit dengan halaman fallback berjalan di sini?

Ya. Setel adapter({ fallback: "200.html" }): Lobsite menyajikan 200.html dengan status 200 untuk setiap path yang bukan file, dan router SvelteKit merender halaman di browser. Halaman yang di-prerender tetap disajikan apa adanya.

Mengapa build SvelteKit saya gagal dengan error prerender?

Sebuah halaman tidak dapat dirender saat build, sering karena membaca url.searchParams, cookie, atau form action. Pindahkan pekerjaan itu ke browser, atau ke fungsi load yang hanya memakai data yang tersedia saat build.

Apakah transisi halaman SvelteKit masih berfungsi setelah prerendering?

Ya. Halaman yang di-prerender memuat klien SvelteKit, yang mengambil alih navigasi setelah halaman pertama, sehingga tautan tetap mengganti halaman tanpa muat ulang penuh.

Hosting statis SvelteKit