Struktur Proyek: src routes static
Jelajahi susunan direktori proyek SvelteKit dan tujuan setiap folder.
Struktur Proyek: src routes static adalah pelajaran Sveltejs Academy gratis di CoddyKit. Ini adalah pelajaran 3 dari 4. Kamu bisa membaca pelajaran lengkapnya di bawah secara gratis — lalu praktikkan langsung di browser dengan editor kode bawaan dan tutor AI 24/7. Ini adalah bagian dari jalur belajar Sveltejs Academy, dan progresmu tersinkronisasi di web dan aplikasi CoddyKit. Kursus Sveltejs Academy mencakup 4 pelajaran total.
Direktori Tingkat Atas
Proyek SvelteKit memiliki direktori utama berikut: src/, static/, serta berkas konfigurasi di direktori akar.
Direktori src
src/ berisi semua kode aplikasi Anda: rute, komponen, kode pustaka, dan titik masuk aplikasi.
Direktori src/routes
Setiap subdirektori src/routes dipetakan ke sebuah URL. Berkas bernama +page.svelte dalam sebuah direktori menentukan apa yang ditampilkan pada jalur tersebut.
Contoh Rute
Jalur src/routes/about/+page.svelte ditampilkan di /about pada peramban.
src/routes/
+page.svelte -> /
about/+page.svelte -> /about
blog/[slug]/+page.svelte -> /blog/:slugDirektori src/lib
src/lib digunakan untuk modul dan komponen bersama. Impor dari direktori ini menggunakan alias $lib.
import Button from "$lib/Button.svelte";Direktori static
Berkas dalam static/ disajikan apa adanya di akar URL. Gunakan direktori ini untuk favicon.png, robots.txt, dan aset lain yang tidak diproses.
Berkas Konfigurasi
Direktori akar berisi svelte.config.js, vite.config.js, package.json, dan, secara opsional, tsconfig.json.
svelte.config.js
Menentukan prapemroses, adaptor, dan opsi tingkat kit. Adaptor menentukan cara aplikasi Anda dibangun untuk penerapan.
import adapter from "@sveltejs/adapter-auto";
export default { kit: { adapter: adapter() } };vite.config.js
Mengonfigurasi Vite (penggabung paket yang mendasarinya). Tambahkan pengaya, alias, aturan proksi server, dan opsi pembangunan di sini.
Berkas app.html
src/app.html adalah kerangka HTML yang membungkus setiap halaman. Penampung seperti %sveltekit.head% diisi pada waktu pembangunan.
Berkas Hooks
src/hooks.server.js memungkinkan Anda mencegat permintaan di server. Kita akan membahas hooks dalam kursus berikutnya.
Pemeriksaan Singkat
Di mana berkas rute halaman SvelteKit berada?
Rangkuman
Sekarang Anda mengetahui tata letak proyek: src untuk kode, routes untuk halaman, lib untuk kode bersama, dan static untuk aset mentah.
Belajar HTML dengan tutor AI — gratis
Tulis dan jalankan kode asli di browser kamu, dapatkan bantuan instan dari tutor AI 24/7, dan lanjutkan di mana kamu tinggalkan di web atau aplikasi.
- Kursus
- 41
- Pelajaran
- 163
Pertanyaan yang Sering Diajukan
Apakah pelajaran “Struktur Proyek: src routes static” gratis?
Ya — teks lengkap “Struktur Proyek: src routes static” gratis dibaca di sini di web. Untuk praktiknya secara interaktif (editor kode bawaan dan tutor AI 24/7) dan buka sisa kursus Sveltejs Academy, upgrade ke CoddyKit PRO. Kursus Sveltejs Academy mencakup 4 pelajaran total.
Apa yang akan aku pelajari di “Struktur Proyek: src routes static”?
Jelajahi susunan direktori proyek SvelteKit dan tujuan setiap folder. Kamu berlatih Sveltejs Academy dengan kode praktik yang langsung kamu jalankan di browser, dan tutor AI 24/7 menjawab pertanyaanmu saat kamu mengerjakan pelajaran ini.
Apakah aku perlu pengalaman untuk memulai Sveltejs Academy?
Tidak diperlukan pengalaman sebelumnya. Sveltejs Academy di CoddyKit dirancang untuk pemula hingga pelajar tingkat lanjut, jadi kamu bisa memulai di sini atau dari awal dan belajar sesuai kecepatan kamu sendiri. Ini adalah pelajaran 3 dari 4.
Berapa lama pelajaran “Struktur Proyek: src routes static” memakan waktu?
Sebagian besar pelajaran CoddyKit memakan waktu sekitar 5–10 menit. Setiap pelajaran ringkas dan interaktif, jadi kamu membuat kemajuan stabil dan melanjutkan dari tempat kamu tinggalkan di web dan aplikasi.
Bisakah aku menulis dan menjalankan kode dalam pelajaran Sveltejs Academy ini?
Ya. Setiap pelajaran Sveltejs Academy menyertakan editor kode bawaan, jadi kamu menulis dan menjalankan kode nyata langsung di browser dan mendapatkan umpan balik AI instan — tidak diperlukan penyiapan lokal.
Semua pelajaran dalam kursus ini
- Apa Itu Svelte dan Mengapa Svelte Mengompilasi Kode
- Membuat Proyek dengan npm create svelte
- Struktur Proyek: src routes static
- Server Pengembangan dan Penggantian Modul Panas