page option

sting01·2023년 5월 11일

sveltekit

목록 보기
8/9

ssr, csr

  • 기본값 ture, 서버에서 먼저 실행 후 브라우저에서 실행
export const ssr = true;
export const csr = false;

prerender

export const prerender = true; //ex 'auto', true, false

prerender ture 시

output 폴더에 prerender에 생성
새로고침 할때 마다 변경

ex
routes/api/current-time/current-time.js

export async function GET() {
	return new Response(new Date().toLocaleTimeString());
}

export const prerender = true;

+page.js

export const load = async ({ fetch }) => {
	console.log('Loading');
	const res = await fetch('/api/current-time');
	const currentTime = await res.text();

	return { currentTime };
};

 export const prerender = true;

+page.svelte

<script>
	import { goto, preloadData, preloadCode } from '$app/navigation';

	export let data;
</script>

<style>
</style>

<p>
	{data.currentTime}
</p>

dynamic routes 적용시 사전 파일 생성 됨.

  • 오류: config.kit.preender.entries의 각 멤버는 '*'이거나 '/'로 시작하는 절대 경로여야 합니다.
  • 빌드 시 prerender 부분에 대한 설정값 필요 아니면 에러
const config = {
	// Consult https://kit.svelte.dev/docs/integrations#preprocessors
	// for more information about preprocessors

	kit: {
		adapter: adapter({
			// see the 'Deployment configuration' section below
		}),
		prerender: {
			// default: true,
			crawl: true,
			entries: ['/'],
		},
	},
	preprocess: [
		vitePreprocess(),
		preprocess({
			defaults: {
				style: 'postcss',
			},
			postcss: {
				plugins: [tailwind, autoprefixer],
			},
		}),
	],
};

0개의 댓글