+page.svelte
접근할 때
+layout.svelte
레이아웃 파일. +page.svelte을 감싸는 레이아웃
+page.js
서버에서 유저에게 데이터를 전송할 때 사용
+page.svelte 로드 시 +page.js 실행
+page.svelte 내부에 script 태그에서 export 해주면 됨
page, layout 컴포넌트들은 load
함수 사용 가능
컴포넌트 생성 전에 실행 - 컴포넌트 생성 전에 데이터를 fetch할 수 있음
+page.server.js
서버 사이드 렌더링 시 사용
+app.html
+server.js
예약 함수 GET, POST, PUT, DELETE를 통해 http 메서드 별 라우터 구현
매개변수로 {fetch, request} 등 사용
src/hook.server.ts
매 요청마다 해당 파일의 함수들이 미들웨어처럼 동작
여러 함수를 실행할 수 있음. export 시 sequence의 매개변수를 추가로 넘기면 됨
import type { Handle } from '@sveltejs/kit'
import { sequence } from '@sveltejs/kit/hooks';
const example = (async ({ event, resolve }) => {
console.log(event, resolve);
const res = await fetch('<https://www.naver.com>', {
method: 'get',
});
console.log('12343221');
return await resolve(event);
}) satisfies Handle;
export const handle = sequence(example);
[~]
동적 라우팅 시 사용
_, .
파일이나 폴더 이름에 언더바나 온점이 들어가면 해당 파일/폴더는 라우팅되지 않음
+layout.svelte 파일 내부에 페이지(+page.svelte)를 표시할 영역을 slot 태그로 나타내야 함
<slot />
RequestHandler 타입 레퍼런스